最近开始写React了，对于 props 和 state 这两个有了更多的了解。
通过一个实例来谈谈我的理解。
需求
需要一个 Layout Component， 给定 20 张图片，异步渲染出来，先加载完，先渲染。（FIFR）
思路
props 应当传入 20 这个数据， state 用来控制 Layout Component 如何从 0 -> 20。不同的 state 对应对应的 view 。
那么 0 -> 20 这个状态由谁来控制？
Option 1. 如果项目里有用redux之类的 state 管理库，那么无庸赘述，放里面就好了。
Option 2. 这个思路有点类似于递归。有且只有 props 引起的调用会触发若干异步的 setState() 方法。注意有且只有 props 变化才会引起异步的 setState() 方法。所以下一个 render 的生命周期是不会再次触发异步的 setState() 方法。 由此也实现了父 Component 改变 props，Component 本身改变 state。
Option 3. 分层，Layout Component 再定义一个子 Component，只做 render，Layout Component 拿到该子 Component 的 ref。 在异步方法里直接传入参数，再 forceUpdate。
因为项目大小是中等偏小，所以没有用上 redux。
Option 3 又有点太过 Hack，所以我选择了 Option 2。
因为才写 React，不知道是不是有更多的好方法。
网友评论