对react的一些看法和见解（实例）

　　渲染页面：

　　react中将功能分割成组件，只关注组件状态(state,props)的变化。所有的操作都是在虚拟dom上,每当组件状态发生变化就生成新的dom数据，然后将上一次的dom跟本次dom进行比较，只将变化的部分更新到真实的dom上。

　　props和state的区别

　　state可以用来与用户交互，通过setState({})来更新和修改数据

　　父子组件的数据传递通过props传递，数据是单向传递的，自顶向下，不要尝试改变props

　　1.父组件->子组件 通过 Children中通过thisps.title获取

　　2.子组件->父组件 仍是通过props传递，但传递的是函数，子组件调用该函数即可

　　生命周期

　　componentDidMount() 只执行一次，发生在组件已经插入到真实dom中，一般fetch请求写在该方法

　　componentWillReceiveProps(nextProps) props改变便执行

　　{某方法}

　　其中方法中不能使用thisps否则还是获取的上一次数据

　　注意当props未发生变化时也可能会执行该方法

　　可在nextProps!==thisps判断里使用该方法

　　若使用componentWillUpdate等生命周期函数可能会不断执行该方法原因是（在这个方法中你不可以使用setState,否则会触发一轮新的渲染，不断调用componentWillUpdate,陷入无限循环）

　　该方法通常用在props改变时

　　this

　　在react中使用类来声明组件

　　class 类名 extends Reactponent

　　{ constructor(props){super(props);}

　　handleClick(){};

　　render(){return

　　}

　　在react中使用jsx语法所以所有的事件如click，blur首字母大写，

　　获取this的指向

　　1.方法若采用类方法，在constructor中写this.handleClick=this.handleClick.bind(this)或者在回调中

　　onClick={this.handleClick.bind(this)}或onClick={()=>this.handleClick()}

　　2.方法也可写成箭头函数形式即可，handleClick=()=>{}

　　方法传参

　　1.若使用箭头函数写方法，调用时this.方法即可不能写成this.方法()否则页面渲染时就会调用该方法

　　this.函数.bind(this,参数)

　　()=>this.函数(参数)

　　react之jsx语法

　　1der中最外层只能有一个HTML标签包裹

　　2.表达式要用{}包裹

　　3.react设置组件样式

　　1.内联

　　

 

　　2.选择器

　　const pStyle={color:"gray"}

　　

 

　　3.对象

　　.pStyle{color:"gray"}