네스트된 객체에 대해 State를 설정하려면 어떻게 해야 합니까?

네스트된 객체에 대해 State를 설정하려면 어떻게 해야 합니까?

사용하고 있는 플러그인의 경우는, 다음과 같은 상태가 필요합니다.

getInitialState() {
  return {
    invalid: true,
    access: {
      access_code: '',
      zipcode: '',
      password: '',
      confirm: '',
      hospital_id: '',
    },
  }
},

나머지 액세스 권한을 설정하지 않고 hospital_id 상태를 설정하려면 어떻게 해야 합니까?

그러면 hospital_id를 제외한 모든 것이 삭제됩니다.

this.setState({access: {hospital_id: 1}})

몇 가지 옵션이 있습니다.

1. ECMA6에서는 오브젝트 스프레드 제안을 사용할 수 있습니다....)는 갱신된 속성을 가진 오브젝트 복사본을 만듭니다.

   this.setState({
     access: {
       ...this.state.access,
       hospital_id: 1,
     },
   });
   

2. 오브젝트에서 네이티브 할당 기능을 사용할 수 있습니다( ).Object.assign())

   this.setState({
     access: Object.assign({}, this.state.access, {
       hospital_id: 1,
     }),
   });
   

3. 또는 최단 버전 및 원자 업데이트의 경우:

    this.setState(({access}) => ({access: {
      ...access,
      hospital_id: 1,
    }});
   

4. 또 하나의 옵션은 업데이트 애드온입니다.

   var update = require('react-addons-update');
   // per React docs 
   // https://reactjs.org/docs/update.html 
   // , you may want to change this to 
   // import update from 'immutability-helper';
   this.setState({
     access: update(this.state.access, {
       hospital_id: {$set: 1},
     })
   });
   

첫 번째 것을 사용하는 것을 추천합니다.

let newAccess = Object.assign({}, this.state.access);
newAccess.hospital_id = 1;
this.setState({access: newAccess});

현재 선호하는 방법은 다음과 같습니다.

let newAccess = this.state.access;
newAccess.hospital_id = 1;
setState({access: newAccess});

현재 받아들여지고 있는 답변보다 약간 단순합니다.

EDIT (@SILENT로부터의 질문에 근거합니다)

이것은 실제로 잠재적으로 위험한 방법인 것 같습니다.여기서 더 읽어보세요 리액트: 불변성에 대해 (매우 간략하게) 이야기합니다.

더 나은 방법은 다음과 같습니다.

let newAccess = Object.assign({}, this.state.access, {hospital_id:1});
this.setState({access: newAccess});

또 다른 방법은

const newAccess = {...this.state.access};
newAccess.hospital_id = 1;
setState({access: newAccess});

확산 연산자를 사용하면 다음 복제본이 생성됩니다.this.state.access.

저도 같은 문제(같은 맥락이 아님)가 있었습니다만, 아래의 코드를 제 자신의 작업에서 실행했는데, 완벽하게 동작했습니다.

this.setState({
  access: {
    ...this.state.access,
    hospital_id: 1,
  },
});

이를 위한 최선의 방법은 ES6입니다.확산 오브젝트를 사용하여 다음과 같이 상태를 갱신할 수 있습니다(이 방법으로 "hospital_id"를 재할당합니다).

this.setState({ access : {...this.state.access , hospital_id : 1 } })

언급URL : https://stackoverflow.com/questions/34956479/how-do-i-setstate-for-nested-object