react 改变深层数据对象

在React中经常会使用到setState,.在开发过程中,时长会在state中遇到一些比较复杂的数据结构,类似下面这样的

state={
 reportList: {
                        2: { // 出生及政策符合情况表
                            note: '2018年12月', // 有效期
                            zoningCodePosition: '_A12', // 关于报表下钻所隐藏区划代码的位置
                            zoningNamePosition: '_B12', // 关于报表下钻时区划名称的位置
                            tableClassName: 'getPeoplePolicyMonitorHistory', // 报表样式名称
                        },
                        3: { // 人口监测统计报表
                            note: '2024年11月', // 有效期
                            zoningCodePosition: '_B14', // 关于报表下钻所隐藏区划代码的位置
                            zoningNamePosition: '_B14', // 关于报表下钻时区划名称的位置
                            tableClassName: 'getPeopleMonitorHistoryOld',
                        },
                        4: { // 已婚育龄妇女节育措施情况统计表
                            note: '', // 有效期
                            zoningCodePosition: '_A12', // 关于报表下钻所隐藏区划代码的位置
                            zoningNamePosition: '_B12', // 关于报表下钻时区划名称的位置
                            tableClassName: 'history_68',
                        },
                    },
                    }

现在需要改变state里面的reportList对象中的某一个value值：

直接去setState一个完整的对象是无法改变的

this.setState({
                    reportList: {
                        2: { // 出生及政策符合情况表
                            note: '2018年12月', // 有效期
                            zoningCodePosition: '_A12', // 关于报表下钻所隐藏区划代码的位置
                            zoningNamePosition: '_B12', // 关于报表下钻时区划名称的位置
                            tableClassName: 'getPeoplePolicyMonitorHistory', // 报表样式名称
                        },
                        3: { // 人口监测统计报表
                            note: '2024年11月', // 有效期
                            zoningCodePosition: '_B14', // 关于报表下钻所隐藏区划代码的位置
                            zoningNamePosition: '_B14', // 关于报表下钻时区划名称的位置
                            tableClassName: 'getPeopleMonitorHistoryOld',
                        },
                        4: { // 已婚育龄妇女节育措施情况统计表
                            note: '', // 有效期
                            zoningCodePosition: '_A12', // 关于报表下钻所隐藏区划代码的位置
                            zoningNamePosition: '_B12', // 关于报表下钻时区划名称的位置
                            tableClassName: 'history_68',
                        },
                    },
                    })

需要作用于对象中的深层级和第一层级

   let data = this.state.reportList
    data['3'].tableClassName='getPeopleMonitorHistoryOld'
    this.setState({
         reportList:data
            })

这样就好了。