首页 > 其他 > 详细

react 父组件值改变,子组件无变化时,使用深度拷贝可解决

时间:2021-07-16 15:09:12      阅读:20      评论:0      收藏:0      [点我收藏+]

深度拷贝方法:

export default deepCopy (data) {
return JSON.parse(JSON.stringify(data))
}

//问题:做一个全选的功能,全选按钮在父组件,子组件作为列表的项,当父组件选中全选时,将子组件的状态置为选中,反之则为取消选中状态。

全选代码如:
//全选
    selectAll = () => {
        let data = [...this.state.cardData]
        for (let i of data) {
            i.selected = !this.state.selectAll  //是否全选字段,
        }
        data = this.deepCopy(data)  //深度拷贝要重新赋值的列表
        this.setState({
            selectAll: !this.state.selectAll,  //控制是否全选显示状态
            cardData: [...data],   //重新赋值
            dataSource: this.state.dataSource.cloneWithRows(data)
        }, () => {
            
        })
    }

这样就可以触发子组件数据的更新,当父组件数据更新,子组件状态无变化时,可使用深度拷贝数据赋值的方法。

react 父组件值改变,子组件无变化时,使用深度拷贝可解决

原文:https://www.cnblogs.com/lxs-616/p/15019388.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!