初识react

react 被称为颠覆式前端开发

react不是一个完整的mvc，并认为mvc并不适应所有开发场景

官网：

http://facebook.github.io/react/index.html

1.

<script type="text/jsx">

<strong>var Hello=React.createClass(

      render:function(){

             return <div>Hello {this.props.name}</div>

     });

React.render(<hello name="World"/>,document.getElementById('container'));</strong>

注：其中的<div>并不是dom节点，而是react divcomponent的一个实例

2.class在js语言的 标准是一个关键字，不能直接在react的标签中是用class，改用classname

3.内联样式的stylecss注意，写作style={{color:'red'}}

实质为：

var styleObj={color:'red'};

style={styleObj}

4.React Components Lifecycle

Mounted:render解析生成dom的过程

update:mounted components被重新render的过程

unmounted:mounted Components对应的Dom节点被从dom结构中移除的过程。

注：每个状态react都封装了对应的hook函数

5.各阶段函数

Mounting: getInitialState()

componentWillMount()

render()

componentDidMount()

Updating: componentWillReceiveProps()

shouldComponentUpdate()

componentWillUpdate()

render()

componentDidUpdate()

Unmounting: componentWillUnmount()

6.state私有，props属于被调用方

7.setTimeout函数中this表示运行环境（全局对象global,即windows），不表示调用函数的对象

8.react事件监听处理

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!