<!DOCTYPE html>

<html lang="zh">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script src="https://cdn.bootcss.com/react/15.4.2/react.min.js"></script>

    <script src="https://cdn.bootcss.com/react/15.4.2/react-dom.min.js"></script>

    <script src="https://cdn.bootcss.com/babel-standalone/6.22.1/babel.min.js"></script>

</head>

<body>

<div id="react3"></div>

<script type="text/babel">

    var Hello=React.createClass({      //组件Hello首字母要大写，组件里面必须有render方法，用于输出组件。另外组件类Hello只能包含一个顶层标签

        render:function(){

            return <h1>{this.props.name}</h1>;    //组件的属性可以在组件类的 this.props 对象上获取

        },

    });

    ReactDOM.render(

        <Hello name="llm"/>,

        document.getElementById("react3")

    );

</script>

<!--添加组件属性，有一个地方需要注意，就是 class 属性需要写成 className ，for 属性需要写成 htmlFor ，这是因为 class 和 for 是 JavaScript 的保留字。-->

</body>

</html>

Demo4的更多相关文章

  1. 日程管理Demo4中的bug

    Demo4的github地址 模拟器有点慢之后贴图 https://git.oschina.net/annie_guo/study.git 在登陆注册界面中java的提示语言(Login.java) ...

  2. WPF Demo4

    <Window x:Class="Demo4.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/ ...

  3. Demo4 Slides.js的使用

    Slides.js挺好用的啊,把示例中的Demo调试通了.首先把css.img.js文件夹下的内容全部拷贝到Vs网站项目下的Scripts文件夹下. 代码主要修改了一些图片路径和网址链接. <! ...

  4. Ember.js demo4

    <!DOCTYPE html> <html> <head> <meta name="description" content=" ...

  5. AngularJs练习Demo4

    @{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport&quo ...

  6. 23 服务音乐的启动Demo4

    注意如果音乐服务和Activity在一个应用中那么将不会因为绑定的Activity销毁而关闭音乐 MainActivity.java package com.qf.day23_service_demo ...

  7. 20 ViewPager Demo4自动轮播

    MainActivity.java 思想:才用非常大的数 让其看起来可以循环轮播图片并且用户可以从尽头滑到首图的特点 . package com.qf.day20_viewpager_demo4; i ...

  8. 流程设计器jQuery + svg/vml(Demo4 - 画连线)

    流程结点可以添加了之后,接下来到画结点与结点之间的连线,效果图如下 很眼馋visio的连线可以折来折去,这里实现的连线比较简单. 首先是把连线的类型分为Z(折线).N(折线)及I(直线)3种类型,然后 ...

  9. [高并发]Java高并发编程系列开山篇--线程实现

    Java是最早开始有并发的语言之一,再过去传统多任务的模式下,人们发现很难解决一些更为复杂的问题,这个时候我们就有了并发. 引用 多线程比多任务更加有挑战.多线程是在同一个程序内部并行执行,因此会对相 ...

随机推荐

  1. Apache Commons Configuration读取xml配置

    近期项目自己手写一个字符串连接池.因为环境不同有开发版本.测试版本.上线版本.每一个版本用到的数据库也是不一样的.所以需要能灵活的切换数据库连接.当然这个用maven就解决了.Apache Commo ...

  2. ROS_Kinetic_24 使用catkin_create_qt_pkg快速创建qt-ros功能包

    使用catkin_create_qt_pkg快速创建qt-ros功能包 参考网址: qt_create:http://wiki.ros.org/qt_create qt_ros:https://git ...

  3. Objc将数据写入iOS真机的plist文件中

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 如何写入模拟器的博文在 这里 但是这对真机不管用,因为在真机环 ...

  4. Cocos2D中图片加-hd后缀的说明

    你可能注意到实际上游戏中的sprite都有2张图片,它都对应该精灵,并包含在资源包中(resource pack): player.png(27x40 pixels)和player-hd.png(do ...

  5. xml解析方式之JAXP解析入门

    XML解析 1 引入 xml文件除了给开发者看,更多的情况使用[程序读取xml文件]的内容.这叫做xml解析 2 XML解析方式(原理不同) DOM解析 SAX解析 3 XML解析工具 DOM解析原理 ...

  6. PO标准form的一点疑问

    最近在修改采购订单form的时候,发现采购订单form往数据库中插数据的地方找不到,程序太多.我们又需要根据界面上的item的值在订单界面数据生成数据库数据时插值时,只能是想其他办法,一种是在on-i ...

  7. GDAL书籍

    GDAL的书籍经过快两年的编写修改,终于出版发行了,有需要的同学可以到下面的网址进行购买. 购买地址: 亚马逊:http://www.amazon.cn/GDAL%E6%BA%90%E7%A0%81% ...

  8. 小强的HTML5移动开发之路（11）——链接，图片，表格，框架

    来自:http://blog.csdn.net/dawanganban/article/details/18098193 一.HTML是什么? HTML(hypertext mark-uplangua ...

  9. 03_TortoiseGit冲突和补丁演示，补丁冲突

     1 下载TortoiseGit,下载地址: http://tortoisegit.soft32.com/free-download/ 2 创建一个GIT仓库 3 创建克隆,创建两个用于克隆的仓库 ...

  10. Collections.sort()的分析

    首先我们得说明在Collections里面有两个排序方法 public static <T> void sort(List<T> list, Comparator<? s ...