невозможно обновить состояние с помощью помощника по неизменности

Question

У меня есть объект в моем состоянии и вложенный объект в родительском объекте, и обновление объектов в состоянии может привести к изменению состояния, и многие ответы рекомендуют использовать immutability-helpers, (response-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

Это очень просто и не нужно изучать API, как в случае immutability-helpers, $ push, $ set и т. Д.

Вот пример с их страницы

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;
   }););
}