<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="./js/react.js"></script>
<script src="./js/react-dom.js"></script>
<script src="./js/browser.min.js"></script>
</head>
<body>
<div id="demo"></div>
<script type="text/babel">
//定义一个组建,名字第一个必须是大写
var Fir = React.createClass({
render:function(){
return(
//必须要有一个大标签包围着才可以
<div>
<h1>Hello 夺命雷公狗</h1>
<input type="text" name="" />
<input type="button" value="留言" />
</div>
);
}
}); ReactDOM.render(<Fir />, /*这里其实也可以使用双标签的如:<Fir></Fir> */
document.getElementById('demo'),
function(){
alert('页面渲染完成');
});
</script>
</body>
</html>

夺命雷公狗-----React---3--标签的规则的更多相关文章

  1. 夺命雷公狗---DEDECMS----12dedecms全局标签的使用以及嵌套标签的使用

    在网站开发中,在很多页面可能会使用到同一个变量,比如路径网站信息等,所以我们可以用全局变量来使用. 默认的放在: 进去里面看下就会发现很多的常量都是在这里定义的: 我们在实际开发的时候可以将我们在多个 ...

  2. 夺命雷公狗---DEDECMS----11dedecms字段标签

    如果我们在开发的时候需要对获取的某个字段进行二次开发,我们可以对字段值调用某个函数来完成需求, 实例代码如下所示: <!DOCTYPE html> <html> <hea ...

  3. 夺命雷公狗---DEDECMS----10dedecms双标签

    双标签基本语法如下: {dede:标签名 参数名=“值” 参数名2=“值”...} 内容...... {/dede} 我们先来查看下手册,如下所示: 我们先来用一个channel的标签来做实例,因为c ...

  4. 夺命雷公狗---DEDECMS----9dedecms单标签

    我们这一节课开始将dedecms的标签了,dedecms里面的标签分好多个的,我们先来看下他的标签长得啥样的先: 随便点击一个修改即可见到标签了: 这里面上面的大文本框里面有标签的用法下面有参数的说明 ...

  5. 夺命雷公狗-----React---10--组建嵌套进行数据遍历

    先写一个组建... 然后进行嵌套.. <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  6. 夺命雷公狗-----React---9--map数据的遍历

    比如我们要实现的是这种效果: 用这种方法来写,她只能写死在哪,没啥意思,所以我们定义一个数据,然后来测试下map方法对她遍历出来的数据 <!DOCTYPE html> <html l ...

  7. 夺命雷公狗-----React---8--react官方提供的组建实现双向绑定

    首先要引入她.. <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  8. 夺命雷公狗-----React---7--组建的状态props和state

    props:组建初始要渲染的数据,他是不可以改变的 state:组建状态发生改变,调用render重新渲染数据 我们来写一个例子: <!DOCTYPE html> <html lan ...

  9. 夺命雷公狗-----React---6--props多属性的传递

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. C#读取XML文件的方法

    先写一个xml文件: <?xml version="1.0" encoding="utf-8" ?> <bookste> <!-- ...

  2. Oracle中"行转列"的实现方式

    在报表的开发当中,难免会遇到行转列的问题. 以Oracle中scott的emp为例,统计各职位的人员在各部门的人数分布情况,就可以用"行转列": scott的emp的原始数据为: ...

  3. [LintCode] Evaluate Reverse Polish Notation 计算逆波兰表达式

    Evaluate the value of an arithmetic expression in Reverse Polish Notation. Valid operators are +, -, ...

  4. 教你彻底解决css中设置z-index的值无效的问题

    在使用z-index这个属性之前,我们必须先了解使用z-index的必要条件: 1.要想给元素设置z-index样式,必须先让它变成定位元素,说的明白一点,就是要给元素设置一个postion:rela ...

  5. css限制div字符超出部分,简单有方便

    text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-w ...

  6. Unity3D游戏引擎最详尽基础教程

    第一节 加入重力 我们先打开Unity3d,新建一个场景(Scene),新建的时候应该会有对话框要求你加入哪些Asset Package,记得选择Physics Material,因为后面我们一定要用 ...

  7. openoffice从word转pdf问题

    http://www.oschina.net/question/227511_87517

  8. 数组API

    1.数组的创建 var arrayObj = new Array();//创建一个默认数组,长度是0 var arrayObj = new Array(size);//创建一个size长度的数组,注意 ...

  9. css 多行溢出

    <div style=" height: 38px; max-width: 180px; -webkit-box-orient: vertical; word-break: break ...

  10. java中类的继承

    我们都知道java的四大特性:抽象.继承.封装.多态: 那么关于继承有哪些特性呢?下面看具体实例: (1) public class Person { public  int a=2; public  ...