*React不属于MVC、MVVM,只是单纯的V层。
*React核心是组件(提高代码复用率、降低测试难度、代码复杂度)。
*自动dom操作,状态对应内容。
*React核心js文件:react.js和react-dom.js,每一个react组件开发都必须引用这两个js文件。
*browser.js用来将浏览器不识别的jsx代码翻译成js,通常也是作为第三个js文件引入。
*jsx代码: js跟xml混合一起的代码。
1.一段jsx代码
<div id="box"></div>
<script type="text/babel">
//注释---js 跟xml 混在一起写的风格,叫做jsx代码,需要借助工具(browser.js)翻译成正常的js代码
ReactDOM.render(
<div> <h1>Hello, world!</h1> <ul> <li>12345</li> </ul> </div>, document.getElementById('box') ); </script>2.自定义React组件
<div id="box"></div>
<script type="text/babel">
//自定义react组件
var Hello= React.createClass({
render:function(){ return ( <div> <h2>Hello world 组件!</h2> <ul> <li>1111</li> <li>2222</li> <li>3333</li> </ul> </div> )} })ReactDOM.render(<Hello></Hello>,document.getElementById("box"));
</script>
*组件首字母是大写 会被认为是自定义组件,首字母是小写,会被认为是 原生dom节点
* 组件最外层需要被一个标签包裹,不能有兄弟节点
* return (加上小括号,可以缩进)