今天在開發(fā)中遇到的坑美莫，redux提交一個(gè)action改變一個(gè)state后，拿到新的props.images（數(shù)組）梯捕。 發(fā)現(xiàn)沒有觸發(fā)componentWillReceiveProps 半天沒查到是什么原因厢呵，還好最后在帶我進(jìn)react的大牛，肖大哥的幫忙下找到了原因傀顾。
記錄下來襟铭，希望幫到很多新進(jìn)react坑的小伙伴
貼代碼~~
ConsultService.deleteImages({
uploadId: data.uploadId,
imageId: data.imageId,
casesId: this.props.casesId
}).then((data) => {
// redux中取得images
let newList = this.props.images;
newList.splice(index, 1);
this.setState({
images: newList
},()=>{
const { imagesAction } = this.props;
imagesAction.changeImages(this.state.images)
console.log(this.props.images)
})
})
這里提交一個(gè)action ，因此組件會從redux中接收到新的props.images.可是發(fā)現(xiàn)并沒有觸發(fā)componentWillReceiveProps.
原因是因?yàn)樵趓eact中短曾，不是根據(jù)數(shù)據(jù)內(nèi)容變化來判斷是否變化寒砖，而是根據(jù)數(shù)據(jù)的引用是否變化。而這里this.props.images是一個(gè)數(shù)組嫉拐，數(shù)組內(nèi)容發(fā)生變化哩都，可是引用沒變，所以react認(rèn)為它沒變
解決辦法
new一個(gè)數(shù)組婉徘，改變數(shù)組的引用
const { imagesAction } = this.props;
const arr = [];
arr.concat(this.state.images);
imagesAction.changeImages(arr)
console.log(this.props.images)
這樣就可以了漠嵌。是react中比較坑的一個(gè)地方。
具體react為什么有這種機(jī)制?
mark 有待深入研究...
