<!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. 测试简单for循环的效率

    os : CentOS 5.2 代码:test-usecond.c #include <stdio.h> #include <sys/time.h> // for gettim ...

  2. Lanterns

    Lanterns 题目链接:http://acm.hust.edu.cn/vjudge/contest/view.action?cid=86640#problem/B 题目: Description ...

  3. iosiPhone屏幕尺寸、分辨率及适配

    iosiPhone屏幕尺寸.分辨率及适配     1.iPhone尺寸规格 设备 iPhone 宽 Width 高 Height 对角线 Diagonal 逻辑分辨率(point) Scale Fac ...

  4. android-对话框

    一.常用对话框 AlertDialog: 功能最丰富,实际应用最广的对话框(以下三种对话框都是该对话框的子类) ProgressDialog:进度对话框.这个对话框只是对进度条的包装 DatePick ...

  5. concat,reverse

    1.concat 连接,拼接 <script> var arr1=[1,2,3]; var arr2=[4,5,6]; var arr3=[7,8,9]; alert(arr1.conca ...

  6. eclipse中如何修改dynamic web module version

    java项目中,若切换服务器,经常会涉及到动态web模块版本的问题.      比如:新建了web项目,开始使用tomcat服务器,但是后来使用jboss服务器,就会出现:Project facet ...

  7. Matlab图像处理函数：regionprops

    本篇文章为转载,仅为方便学术讨论所用,不用于商业用途.由于时间较久,原作者以及原始链接暂时无法找到,如有侵权以及其他任何事宜欢迎跟我联系,如有侵扰,在此提前表示歉意.----------------- ...

  8. Oracle 11g的Redo Log和Archive Log的分析方法

    自Oracle 11g起,无需设置UTL_FILE_DIR就可以使用LOGMNR对本地数据库的日志进行分析,以下是使用LOGMNR的DICT_FROM_ONLINE_CATALOG分析REDO和归档日 ...

  9. mysql怎么导入大文件的sql文件

    这个方法在windows上或者linux上都可以使用 多数人习惯使用phpmyadmin或者一些客户端比如workbench,navicat 但是最有效的是原生的php工具 命令都差不多 请在cmd的 ...

  10. CSS权威指南 - 基本视觉格式化 4

    改变元素显示 没有讨论与表格相关的.列表list-item的值.之后讨论. 改变显示角色 显示为块级元素 将一串链接(行内元素)改变垂直放置,若有如下一连串的链接: <div id=" ...