1、React 入门实例教程 ：http://www.ruanyifeng.com/blog/2015/03/react.html （ 阮一峰的博客）  或   https://segmentfault.com/a/1190000012921279（作为阅读参考）

<!DOCTYPE html>

<html>

  <head>

    <script src="../build/react.js"></script>

    <script src="../build/react-dom.js"></script>

    <script src="../build/browser.min.js"></script>

  </head>

  <body>

    <div id="example"></div>

    <script type="text/babel">

      // ** Our code goes here! **

    </script>

  </body>

</html>

注意：Browser.js 的作用是将 JSX 语法转为 JavaScript 语法，这一步很消耗时间，实际上线的时候，应该将它放到服务器完成。

1、组件 ：

var HelloMessage = React.createClass({

  render: function() {

    return <h1>Hello {this.props.name}</h1>;

  }

});

ReactDOM.render(

  <HelloMessage name="John" />,

  document.getElementById('example')

);

react — script引入 和 脚手架使用的区别的更多相关文章

  1. <script runat=server>、<%%>和<%#%>的区别

    ①<script runat="server">代码段与<%%>内联代码段的区别 在asp.net页面的aspx文件中允许使用<script runa ...

  2. ElementUI（vue UI库）、iView（vue UI库）、ant design（react UI库）中组件的区别

    ElementUI(vue UI库).iView(vue UI库).ant design(react UI库)中组件的区别: 事项 ElementUI iView ant design 全局加载进度条 ...

  3. ​Web(click and script) 与 Web(HTTP/HTML)协议区别

    Web(click and script) 与 Web(HTTP/HTML)协议区别 webjavascriptvbscript浏览器脚本login 先从最简单的说明上来看, Web(HTTP/HTM ...

  4. <script>, <script async>, <script defer> 三种标签的区别

    <script>, <script async>, <script defer> 三种标签的区别 <script>标签 阻塞html parsing 脚 ...

  5. vue+cesiumjs的环境搭建【script引入】

    [可以看我的博客里另外一篇----- import引入 ,可以不用script引入] 最近做项目要用到cesium,然后参照网上的一些步骤,最后发现报错了,其中有两种错比较多: ①  This dep ...

  6. script标签async和defer的区别及作用

    作用: 1.没有 defer 或 async,浏览器会立即加载并执行指定的脚本,也就是说不等待后续载入的文档元素,读到就加载并执行. 2.async 属性表示异步执行引入的 JavaScript,与 ...

  7. React 项目引入 Dva

    背景 现在手上在做的 React 项目因为年代久远,用的 Redux,写代码的体验不太好,所以想升级一下引入 dva.以往使用 dva 都是使用 dva-cli 直接生成 dva 项目,或者在使用 a ...

  8. Ant design在vue，react的引入

    文章地址: https://www.cnblogs.com/sandraryan/ 最近由于 一些不可描述的原因 要研究一下Ant design这个前端框架. 祭上官网: https://ant.de ...

  9. XML引入以及与html的区别

    1.1 引入 HTML: 负责网页的结构 CSS: 负责网页的样式(美观) Javascript: 负责在浏览器端与用户进行交互. 负责静态的网页制作的语言 HTML语言特点: 1)由标签组成. &l ...

随机推荐

  1. html 的一些基础操作

    花了一天学了点html语言..不记下来的话又白学了 基础中的基础格式 <!DOCTYPE html> <html> <head> <!-- 字符集的选择 ut ...

  2. TestComplete 14 百度网盘下载

    TestComplete 14 百度网盘下载 链接:https://pan.baidu.com/s/1g3imm9zFOCKnx5qqtUMl4g 二维码:

  3. UOJ 450 【集训队作业2018】复读机——单位根反演

    题目:http://uoj.ac/problem/450 重要式子: \( e^x = \sum\limits_{i=0}^{\infty} \frac{x^i}{i!} \) \( ( e^{a*x ...

  4. Spring Boot学习一之配置类及自动配置

    一.配置类 1. 导入其他配置类 你不需要将所有的 @Configuration 放进一个单独的类, @Import 注解可以用来导入其他配置类.另外,你也可以使用 @ComponentScan 注解 ...

  5. Linux后台执行脚本 &与nohup

    Linux后台执行脚本的方式: 0.脚本代码 [root@VM_1_3_centos apps]# cat test.php <?php sleep(5); echo "hello w ...

  6. Linux系统CPU占用率较高问题排查思路

    作为 Linux 运维工程师,在日常工作中我们会遇到 Linux服务器上出现CPU负载达到100%居高不下的情况,如果CPU 持续跑高,则会影响业务系统的正常运行,带来企业损失. 很多运维的同学遇到这 ...

  7. ubuntu+qt+opencv

    linux下Qt+OpenCv环境的搭建: https://blog.csdn.net/yaowangII/article/details/84303124 1.qt:https://blog.csd ...

  8. Selenium：八种元素定位方法

    前言: 我们在做WEB自动化时,最根本的就是操作页面上的元素,首先我们要能找到这些元素,然后才能操作这些元素.工具或代码无法像我们测试人员一样用肉眼来分辨页面上的元素.那么我们怎么来定位他们呢? 在学 ...

  9. leetcode.图.207课程表-Java

    1. 具体题目 现在你总共有 n 门课需要选,记为 0 到 n-1.在选修某些课程之前需要一些先修课程. 例如,想要学习课程 0 ,你需要先完成课程 1 ,我们用一个匹配来表示他们: [0,1].给定 ...

  10. PHP 算式验证码

    这里不多说,直接上代码! /** * 改造的加减法验证类 * 使用示例 VerifyCode::get('xxx', 20); * 验证示例 VerifyCode::check('1', 'xxx') ...