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. 微信小程序相关操作

    显示用户基本信息 在微信小程序中,经常会碰到需要展示微信用户的基本信息,如果只是为了显示用户信息,最简单有效的办法是使用open-data,这是微信小程序内置的用于展示微信开放数据的组件,通过改变ty ...

  2. 如何为网站启用HTTPS加密传输协议

    前言 当今时代对上网的安全性要求比以前更高,chrome和firefox也都大力支持网站使用HTTPS,苹果也从2017年开始在iOS 10系统中强制app使用HTTPS来传输数据,微信小程序也是要求 ...

  3. sql优化工具SQLAdvisor的安装

    原文地址:https://www.cnblogs.com/beliveli/articles/6541936.html 本机安装包路径: D:\share\src\linux-mysql\sqlAdv ...

  4. 一双木棋（chess）

    一双木棋(chess) 题目描述 菲菲和牛牛在一块 nn 行 mm 列的棋盘上下棋,菲菲执黑棋先手,牛牛执白棋后手. 棋局开始时,棋盘上没有任何棋子,两人轮流在格子上落子,直到填满棋盘时结束.落子的规 ...

  5. [CSP-S模拟测试76]题解

    咕咕咕 A.序列 无解情况:$n>a*b$或$n<a+b-1$ 把序列分成B段,每段内部上升,各段分界处构成下降子序列. 实现并不是太简单,要动态地考虑一下边界什么的. #include& ...

  6. 数据挖掘之DecisionTreeClassifier决策树

    用决策树DecisionTreeClassifier的数据挖掘算法来通过三个参数,Pclass,Sex,Age,三个参数来求取乘客的获救率. 分为三大步: 一,创建决策树DecisionTreeCla ...

  7. mybatis如何通过接口查找对应的mapper.xml及方法执行详解

    转:http://www.jb51.net/article/116402.htm 本文主要介绍的是关于mybatis通过接口查找对应mapper.xml及方法执行的相关内容,下面话不多说,来看看详细的 ...

  8. Windows-Windows下使用Linux系统（WSL）

    Install Windows Subsystem for Linux (WSL) on on Windows 10 | Microsoft Docs WSL(Windows Subsystem fo ...

  9. swoole webSocket 聊天室示例

    swoole1.7.9增加了内置的WebSocket服务器支持,通过几行PHP代码就可以写出一个异步非阻塞多进程的WebSocket服务器. 基于swoole websocket的用户上下线通知,在线 ...

  10. 初识Flink广播变量broadcast

    Broadcast 广播变量:可以理解为是一个公共的共享变量,我们可以把一个dataset 或者不变的缓存对象(例如map list集合对象等)数据集广播出去,然后不同的任务在节点上都能够获取到,并在 ...