react编辑表格卡顿

react编辑表格卡顿可以考虑的优化方案

1、增加shouldComponentUpdate钩子对新旧 props进行比较，如果值相同则阻止更新避免不必要的渲染，或者使用 PureComponent替代 Component，其内部已经封装了 shouldComponentUpdate的浅比较逻辑。

2、对于列表或其他结构相同的节点为其每一项增加唯一的key属性，以方便 React的diff算法中对该节点的复用，减少节点的创建和删除 *** 作

3、render函数中减少类似写法

因为，每次调用 render函数重新渲染时均会创建一个新的函数，即使内容没有发生任何变化，也会导致节点没必要的重渲染。

建议将函数保存到组件的成员对象中，这样只会创建一次

4、组件的props如果需要经过一系列运算后才能拿到最终结果，则可以考虑使用 reselect 库对结果进行缓存，如果 props值未发生变化则结果直接从缓存中拿，避免高昂的运算代价

5、webpack-bundle-analyzer 分析当前页面的依赖包是否存在不合理性，如果存在找到不合理点并进行优化

这是组件自带的bug,在antd的4版本已经修复了，可是我的是在3版本，所以，还得自己解决。

问题：

然后我选其他页的数据，这个selectedRows数组没有加上前一页的数据，导致拿到的值只有当前页的数据。

解决办法：

        二维数组拼接：

而我们可以拿到selectedRows的值，就是我们想要的。

数据保存在组件。

在React中生命周期方法、Hooks和Suspense是获取数据的方法。

在执行I/O *** 作（例如数据提取）时，要先发送网络请求，然后等待响应，接着将响应数据保存到组件的状态，最后进行渲染。

以上就是关于react编辑表格卡顿全部的内容，包括:react编辑表格卡顿、react+antd写表格的selectedRows时遇到的bug、react.fc获取数据写在哪里等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！