Question

我在我的状态下有一个对象，而在父对象内有一个嵌套的对象，而在状态下更新对象可能会导致状态变异，并建议使用不可变性辅助工具进行很多回答，（react-addons-update）这是我的状态：

    this.state = {
        room: {
            isOpen: false,
            index: '',
            roomNumber: '',
            reserved: '',
            isLux: null,
            _id: '',
            reserver:{
               name: '',
               surname: '',
               national_id: '',
               customer_number: '',
               staying_til: '',
               _id: ''
            }

        }
    }

这是更新房间属性的方法：

roomChangeEvent(e){
       update(this.state, {
            room: {
               [e.target.name]: {$set: e.target.value}

            }
       })
}

和存储属性

changeEvent(e){
        update(this.state, {
            room: {
                reserver: {
                  [e.target.name]: {$set: e.target.value}
                }

            }
       })
}

，但是即使获取值和名称，它也不会更新状态。有什么问题吗？

Answer 1

我会说，使用immer-js https://immerjs.github.io/immer/docs/produce

这非常简单，没有像immutability-helpers，$ push，$ set等情况下学习的api。

以下是他们页面上的示例

import produce from "immer"

const baseState = [
    {
        todo: "Learn typescript",
        done: true
    },
    {
        todo: "Try immer",
        done: false
    }
]

const nextState = produce(baseState, draftState => {
    draftState.push({todo: "Tweet about it"})
    draftState[1].done = true
})

在您的情况下

import produce from "immer"

changeEvent(e){
   this.setState(produce(draftState => {
      draftState.room.reserver[e.target.name] = e.target.value;
   }););
}

无法使用不变性助手更新状态

1 个答案: