React入门一


React.js算是当今主流框架之一了,好多公司项目都是React。直接上图:

所以最近整合一些论坛,今儿咱就说说React,

React 是一个用于构建用户界面的 JAVASCRIPT 库。

React主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图)。

React 起源于 Facebook 的内部项目,用来架设 Instagram 的网站,并于 2013 年 5 月开源。

React 拥有较高的性能,代码逻辑非常简单,越来越多的人已开始关注和使用它。<摘自菜鸟教程>

恩,背景和价值都了解了,咱看看怎么安装它,

React 可以直接下载使用,可以在官网 http://facebook.github.io/react/ 下载最新版。

你也可以直接使用 BootCDN 的 React CDN 库,地址如下:

<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>

需要引入了三个库: react.min.js 、react-dom.min.js 和 babel.min.js:

  • react.min.js - React 的核心库
  • react-dom.min.js - 提供与 DOM 相关操作
  • babel.min.js - Babel 可以将 ES6 代码转为 ES5 代码,这样我们就能在目前不支持 ES6 浏览器上执行 React 代码。Babel 内嵌了对 JSX 的支持。通过将 Babel 和 babel-sublime 包(package)一同使用可以让源码的语法渲染上升到一个全新的水平。

例一:

 1 doctype html>
 2 <html>
 3 <head>
 4 <meta charset="utf-8">
 5 <script src="https://cdn.bootcss.com/react/15.4.2/react.min.js">script>
 6 <script src="https://cdn.bootcss.com/react/15.4.2/react-dom.min.js">script>
 7 <script src="https://cdn.bootcss.com/babel-standalone/6.22.1/babel.min.js">script>
 8 <title>无标题文档title>
 9 head>
10 <body>
11 <div id="example">
12 div>
13 <script type="text/babel">
14 ReactDOM.render(
15     <h1>我爱React</h1>,
16     document.getElementById('example')
17 )
18 script> 
19 body>
20 html>

解释一下,第13行