React使用setState后页面没有更新

if(res.status===200){
                res.data.key = this.state.defaultcardNum
                let newArr = this.state.dataSource
                newArr.splice(this.state.defaultcardNum,1,res.data)
                this.setState({
                    dataSource:newArr
                },()=>{
                    this.setState({
                        visibleUp: false,
                    })
                })
            }

上面代码可能导致页面的 dataSource 不会更新。

原因：因为react的监听是浅监听，只会监听数据第一层的变化，内层发生变化是监听不到的，当使用赋值（=）的时候相当于直接更改了数组对应的内存块，但react内部用于对比的array的内存并没有更改，是指向同一个内存的，因为没有触发render。

解决方法：

if(res.status===200){
                res.data.key = this.state.defaultcardNum
                let newArr = JSON.parse(JSON.stringify(this.state.dataSource))
                newArr.splice(this.state.defaultcardNum,1,res.data)
                this.setState({
                    dataSource:newArr
                },()=>{
                    this.setState({
                        visibleUp: false,
                    })
                })
            }

使用JSON.parse(JSON.stringify(this.state.dataSource))深拷贝赋值

标签：res,JSON,React,state,dataSource,newArr,setState,页面
来源： https://www.cnblogs.com/qiqi400820/p/16358909.html