react知识总结

参考：

react官网：https://react.docschina.org/

 

React 是一个声明式，高效且灵活的用于构建用户界面的 JavaScript 库。

所有 React 组件都必须像纯函数一样保护它们的 props 不被更改。

 

在 React 应用中，任何可变数据应当只有一个相对应的唯一“数据源”。

 

state 代表了随时间会产生变化的数据，应当仅在实现交互时使用。

state 允许 React 组件随用户操作、网络响应或者其他变化而动态更改输出内容。

直接修改state内容，而不是调用setState，那么修改后不会重新渲染组件。

 this.props 和 this.state 可能会异步更新，所以你不要依赖他们的值来更新下一个状态。

 

不管是父组件或是子组件都无法知道某个组件是有状态的还是无状态的，并且它们也并不关心它是函数组件还是 class 组件。

在 JavaScript 中，class 的方法默认不会绑定 this，故需要在constructor（）中使用bind（）进行绑定。

通常情况下，如果没有在方法后面添加 ()，例如 onClick={this.handleClick}，你应该为这个方法绑定 this。

 

在 JavaScript 中，true && expression 总是会返回 expression, 而 false && expression 总是会返回 false。

 

通常，state 都是首先添加到需要渲染数据的组件中去。然后，如果其他组件也需要这个 state，那么你可以将它提升至这些组件的最近共同父组件中。你应当依靠自上而下的数据流，而不是尝试在不同组件间同步 state。

最好将渲染 UI 和添加交互这两个过程分开。这是因为，编写一个应用的静态版本时，往往要编写大量代码，而不需要考虑太多交互细节；添加交互功能时则要考虑大量细节，而不需要编写太多代码。

 

react组件的内置常用方法：

具体使用及其他不常用API参见：

API文档：https://react.docschina.org/docs/react-component.html

图：http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/

componentWillReceiveProps()：在初始化render的时候不会执行，它会在Component接受到新的状态(Props)时被触发，一般用于父组件状态更新时子组件的重新渲染。