03 ReactNative 渲染机制

ReactNative 代码执行逻辑

1. 导入ReactNative组件和API
2. 声明相关变量或常量
3. 定义一个组件
4. 通过AppRegistry向ReactNative框架注册
5. 运行时通过render函数渲染

工作机制

1. 将每个UI视作简单的状态机，组件有可变和不可变的内容，即属性（props）和状态（state），随着状态的改变，UI也被重新渲染。
2. state本身是一个对象，包含多个键值对，可以通过this.state.状态变量来读取变量的值。但是需要注意的是不要通过“this.state.变量名 = 变量值”的方式进行赋值，需要通过this.setState()来修改。
3. 通常来说，需要处理用户输入(包括文本、麦克之类)的需要有对应的状态机变量。
4. 书中建议：将多个负责渲染数据的无状态rn组件，封装在一个有状态的rn组件中，有状态的组件负责交互，无状态的负责渲染。

几个渲染相关函数

1. setState(olaState,callback)

传入一个旧的状态，和一个回调方法

2. shouldComponentUpdate()

每次渲染前会调用该方法，返回false将不渲染组件

3. forceUpdate()

强制重新渲染，不会调用shouldComponentUpdate方法

4. render()

进行渲染的具体方法

其他

1. 可以在构造函数中添加成员变量

  constructor(props){
    super(props);
    this.prop1 = 'prop1';
    this.prop2 = 'prop2';
    this.state = { 
      inputNum:'',
      password:''  
    };
    this.updatePW = this.updatePW.bind(this);
  }

2. 静态变量、静态函数和java类似，调用时直接使用类名调用。