react State改变，页面却没有改变

react 小白编程

做项目时遇到了个问题，无论我怎么查看我的action、reducer 还是 dispatch 函数，都没有发现有什么毛病。但是 debugger 的时候，state 改变了，页面却没有变。

困扰了我好长时间，后来发现是因为我在使用 reducer 修改 state 的时候，遇到了一个极大的错误?！

我要修改的 state 值是一个数组，而我却在原数组上使用 Splice 进行修改。

熟悉 arr.splice() 函数的应该知道，该方法是在原数组上进行修改。而我的原数组就是我的真是的 state。

而 React 的核心是虚拟 DOM，在 render 的时候，会比较前后两个 state 是否发生变化，如果发现没有发生变化，则不进行 DOM 更新。而我在 reducer 的时候直接在原 state 上进行修改，那么在 render 的时候，无论怎样都是发现不了 state 的变化的。

所以，针对上述问题，进行更正：先用 arr.slice() 方法获得一个该数组的副本，然后再对其副本进行修改。这样就正常了！

⚠️所以，使用数组方法的时候，一定要知道哪些是会产生一个数组副本，哪些是在数组本身上进行修改的！

转载于:https://www.cnblogs.com/z-one/p/9132075.html