React Native组件

➕这一步,再搞懂这几步React Native才算入门

概念

在React中，在UI上每一个功能相对独立的模块就会被定义为组件。

相对小的组件可以通过组合或者嵌套的方式构成大的组件，最终完成整体UI的构建。

特征：

• 可组合（Composeable）：可嵌套其他组件或者被嵌套与其他组件。
• 可重用（Reusable）：每个组件都是具有独立功能的，它可以被使用在多个UI场景；
• 可维护（Maintainable）：每个小的组件仅仅包含自身的逻辑，更容易被理解和维护；

属性和状态

在RN里，组件所持有的数据分为两种形式：

1. 属性（props）：组件的props是不可变的，它只能从其他的组件（例如父组件）传递过来。

2. 状态（state）：组件的state是可变的，它负责处理与用户的交互。在通过用户点击事件等操作以后，如果使得当前组件的某个state发生了改变（通过setState()方法更新某个或某几个state），那么当前组件就会触发render()方法刷新自己。

生命周期

组件也有生命周期大致分为三大阶段：

• Mounting：已插入真实 DOM
• Updating：正在被重新渲染
• Unmounting：已移出真实 DOM

8

几个重要的回调函数：

render()：

该函数是组件的渲染回调函数，该函数是必须实现的，并且必须返回一个组件或一个包含多个子组件的组件。如果组件的state改变就会触发该函数

componentDidMount()：

在初始化渲染执行之后立刻调用一次，也就是说，在这个函数调用时，当前组件已经渲染完毕了。

shouldComponentUpdate(objectnextProps,object nextState):

在接收到新的props或者 state，将要渲染之前调用。如果确定新的props和 state不会导致组件更新，则此处应该返回 false，这样组件就不会更新，减少了性能上不必要的损耗。

componentWillUnmount()

在组件从 DOM 中移除的时候立刻被调用。