学习react的一些坑

起因

学习react,在做项目的时候出现了很多问题，现在在这篇文章中进行总结和思考，方便我以后的学习。

问题

基础的问题

react的更新问题

react的更新问题，react的更新会重新执行react函数组件方法本身，并且子组件也会一起更新。

解决办法:导出组件的时候，使用React.memo包裹组件，这样组件就不会重新执行。

useCallback和useMemo的滥用

因为react的更新问题，每次页面进行了更新，其中的方法也会重新进行执行。有的时候会导致useCallback和useMemo的滥用，导致性能问题。

解决办法:当一些对象是固定不变的，将他们放在组件的外面。当给子组件的对象是和组件数据有关的，也就是做一个计算属性采用useMemo().

state数据拿不到

需要在useEffect,useCallback,useMemo中的后面添加上依赖项。

其他优化的问题

useState,useRef和useEffect的使用

当使用了useState会使视图发生改变，但是不能拿到当前的值，要从useEffect中才能拿到。

所以建议是当你这个数据不想让它在视图中展示出来或者说没有必要的话，就可以使用useRef， 当想要视图发生改变的时候，可以使用useState。

推荐的方法:采用副作用方法。通过setxxx来修改数据，通过useEffect来进行监听这个数据的变化。