急求！！！！急救！react有什么最简单的深拷贝方法吗？万分感谢

Question

问题描述
从后台拿到的数据有很多层,但是通过this.setState只能赋值到第一层,之前请求过类似的都不会出现这种情况.一来希望大神们能稍微解释一下,而来希望有一个能快速解决的方法。感激不尽
...
state={
listData:{}
}
...
fetchList({
...
})
.then(data=>{
console.log('data====>',data);
this.setState({
listData:Object.assign({},data);
},()=>{
console.log('listData=====>',this.state.listData);
})
})
data深度的值无法正确复制给data
//console.log1
data=====>{
x1:xxx,
x2:{
x2_1:xxx,
x2_2:xxx,
},
x3:{
x3_1:xxx,
}
//...
}
//console.log2
listData====>{
x1:xxx,
x2:{},
x3:{},
}
第二层开始的都被过滤为空无法赋值.

Answer 1

ES6中的Object.assgin()是实现浅拷贝的。JS深拷贝与浅拷贝，与React没关系的。我们也在做React项目，给出两种解决方案吧1、按楼主的想法，实现Object深拷贝：JSON.parse(JSON.stringify(oldObj));//简单粗暴没有之一，注意这个方法会忽略掉为undefined的属性，不过数据库一般存的是null而非undefined(后台一般是不会帮你把null转成undefined的，吃力不讨好~），所以也可能忽略这个缺点2、完全没必要调用复制data，直接调用setState，React会帮你处理复制的^_^this.setState({listData:data})//然后在任意方法中console.log(this.state.listData)结束~！

Answer 2

可以尝试一下immutable.js不管怎样，深拷贝总会带来性能问题，可以从别的角度来解决这个问题，比如精简数据结构以前只有一个state，现在拆分为多个，每次setState只更新其中某一项就行了