之前用脚手架创建了一个react项目,将react自带的src文件夹删除后创建一个空的src文件夹

在src文件夹中创建一个index.jsx文件作为JS入口文件并创建一个hello组件

现在我们进入到hello.jsx

 import React from 'react';
//声明组件
class Hello extends React.Component{
//写虚拟DOM元素,要卸载render函数里面
render(){
return(
// 如果要写多个标签一定要记得要写在一个根元素里面
<div>
<h1>我是Hello组件中的h1标签</h1>
<p>我是Hello组件中的p标签</p>
</div>
);
}
}
//最后一定要记得向外输出这个组件
export default Hello;

最后我们在终端中输入npm start 就好了

react 简单在页面中输出一段文字的更多相关文章

  1. javascript小实例,在页面中输出当前客户端时间

    时间对象(Date())比较简单,本文旨在为初学者入门使用,大牛可略过! 本文承接基础知识实例,说一下实例的要求: 在页面中输出当前客户端时间(2015年1月1日星期一10:10:10这样的格式),每 ...

  2. 在JSP页面中输出JSON格式数据

    JSON-taglib是一套使在JSP页面中输出JSON格式数据的标签库. JSON-taglib主页: http://json-taglib.sourceforge.net/index.html J ...

  3. 在jsp中用一数组存储了数据库表中某一字段的值,然后在页面中输出其中的值。

    List<String> list = new ArrayList<String>();  String sql = "select userName from us ...

  4. 在Label中显示一段文字

    Let’s create a new Xamarin.Forms PCL solution, named Greetings, using the same process described abo ...

  5. 在Excel表格中输入一大段文字

    1.有时为了注释的需要,在excel中需要输入一大段文字,这时候可以使用—视图-工具-绘图,然后选择下面的文本框,即可自定义文本框大小,如需要文本框和表格边框完全重合,在鼠标画文本框时按住 Alt键.

  6. h5页面关于复制某段文字

    上次的项目有一段内容是点击复制按钮 然后复制一段文字,此段方法我才用的是range.selectNodeContents方法,range对象的SelectNodeContents方法将于range对象 ...

  7. NieR:Automata中的一段文字

    还没开始玩这个游戏,但在网易云音乐上听到一首歌,很好听 http://music.163.com/#/m/song?id=468490570 搜了一下相关视频,发现这首歌是在与一个叫做歌姬的boss战 ...

  8. [HTML]在页面中输出空格的几种方式

    JS中如何输出空格 在写JS代码的时候,大家可以会发现这样现象: document.write("   1      2                3  "); 结果: 1 2 ...

  9. cut 从文本中提取一段文字并输出

    1.命令功能 cut 从每个文件中截取选定部分并输出. 2.语法格式 cut  option  file 参数说明 参数 参数说明 -b (–bytes) 字节 -c (--characters) 字 ...

随机推荐

  1. QQ好友列表数据模型封装

    QQ好友中的信息较多.假设我们单独从plist 中直接取出数据 是能够解决这个问题 可是相当复杂.以为列表中分组 .每组中还有不同信息 大致模型是 数组套数组  数组套字典 所以我们要封装数据模型 / ...

  2. 【剑指offer】无聊的1+2+...+n

    转载请注明出处:http://blog.csdn.net/ns_code/article/details/27964027 题目描写叙述: 求1+2+3+...+n,要求不能使用乘除法.for.whi ...

  3. IOS总结_实现UIButton的图文混排(二)

    非常久没有写博客了,之前写过一篇关于UIButton图文混排的,可是有点复杂,今天来一个比較简单地.相信大家回用得着 UIButton *button=[[UIButton alloc, , )]; ...

  4. 如何做URL静态化 和页面的静态化

    为什么要进行URL静态化? 如果帮到了您,您可以小支持一下,谢谢您   1.更好的迎合搜索引擎工作原理的爬行抓取机制:2.把网站URL静态化更有助于网站获得好的排名:3.URL静态化有利于用户体验.不 ...

  5. Running the app on your device

    So far, you've run the app on the Simulator. That's nice and all but probably notwhy you're learning ...

  6. CentOS安装、配置APR和tomcat-native

    APR:Apache Portable Run-time libraries,Apache可移植执行库 在早期的Apache版本号中.应用程序本身必须可以处理各种详细操作系统平台的细节,并针对不同的平 ...

  7. 2016.04.14,英语,《Vocabulary Builder》Unit 14

    crypt/cryph, comes from the Greek word for 'hidden', encrypt, crypto- crypt : [krɪpt] n. 土窖, 地穴, (教堂 ...

  8. Resin 优化配置

    1.在resin.conf中的session-config内部添加 <session-max>4096</session-max> <session-timeout> ...

  9. fragment.setMenuVisibility setUserVisibleHint

    [Android]Fragment真正意义上的onResume和onPause 前言 Fragment虽然有onResume和onPause的,但是这两个方法是Activity的方法,调用时机也是与A ...

  10. Node.js:JXcore

    ylbtech-Node.js:JXcore 1.返回顶部 1. Node.js JXcore 打包 Node.js 是一个开放源代码.跨平台的.用于服务器端和网络应用的运行环境. JXcore 是一 ...