用React 中的useState改变值不重新渲染的问题

不渲染

const [lists,setLists] =useState([]); ..... const arr = lists; arr.splice(index,1) //根据删除index下标的这一项 setLists([arr]); //重复设置要改变数组的地址

解决办法：

const [lists,setLists] =useState([]); ..... const arr = lists; arr.splice(index,1) //根据删除index下标的这一项 setLists([...arr]); //重复赋值要改变数组的地址

react中数组如果引用地址不变，是不触发重新渲染的，但是值是设置进去了

 

或者

const [lists,setLists] =useState([]); ..... const arr = [...lists]; //克隆的时候改变地址 arr.splice(index,1) setLists(arr);

这里要根据react的渲染机制源码，因为react 会判断旧状态和新状态是否有变化，如果没有变化就不渲染，所以要改变地址告诉render 是新状态要重新渲染