https://facebook.github.io/react/docs/composition-vs-inheritance.html
关注很久,一直想好好研究下,当我看见看见脚本里放标签,就喜欢上它了,以前大部分是从根标签往下套,一直觉得太麻烦,希望能解决这样的问题?
一、介绍
React 是一个灵活且能被用于各种工程中,你能用它建立一个新的应用,但是你不用重写,可以逐渐把它引入到一个已经存在的代码库中。
下面选项中哪一个最能描述你想做什么?
- Try React
- Create a New App
- Add React to an Existing App
二、几种实验法:
第一、用CodePen 在线测试css,html,js非常方便,且效果非常好,这么好的工具怎么写出来的?
第二、如果你更喜欢用文本编辑,你可以download this HTML file,编辑它,在自己本地的浏览器去打开它。它运行很慢,因为每次要加载三个脚本文件,测了下面的页面,需要花费260ms,所以不要用在一个项目中。
注意,网页中实时将ES6代码转为ES5,对性能会有影响。生产环境需要加载已经转码完成的脚本。
2.1 使用三个库:
1> react.js:核心库
2>react-dom.js:提供Dom相关的功能
3> babel.min.js:用于将JSX 语法转化为JavaScript 语法
<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Hello World</title> <script src="js/react.js"></script> <script src="js/react-dom.js"></script> <script src="js/babel.min.js"></script> </head> <body> <div id="root"></div> <script type="text/babel"> //type="text/babel",这是 React 独有的 JSX 语法,跟 JavaScript 不兼容 ReactDOM.render( //ES6脚本放在 script 标签之中<h1>Hello, world!</h1>, document.getElementById('root') ); </script> </body> </html> |
第三、如果你想使用它在整个项目中,有两个最受欢迎的方式:建里一个React 应用,or 增加到已有项目中。
第四、建立一个React 应用:
https://github.com/facebookincubator/create-react-app
1、