리액트 상태를 변환하기 위해 선호하는 방법은 무엇입니까?

리액트 상태를 변환하기 위해 선호하는 방법은 무엇입니까?

예를 들어, 일반 객체의 리스트가 있다고 합시다.this.state.list아이들 목록을 그릴 때 사용할 수 있습니다.그러면 오브젝트를 삽입하는 올바른 방법은 무엇입니까?this.state.list?

아래가 유일한 방법이라고 생각합니다.왜냐하면 당신은 변형을 할 수 없기 때문입니다.this.state문서에 직접 언급되어 있습니다.

this._list.push(newObject):
this.setState({list: this._list});

내가 보기엔 이건 추한 것 같아.더 좋은 방법이 있을까요?

concat 새 배열을 반환하기 때문에

this.setState({list: this.state.list.concat([newObject])});

또 다른 대안은 React의 불변 도우미입니다.

  var newState = React.addons.update(this.state, {
      list : {
        $push : [newObject]
      }
  });

  this.setState(newState);

setState()는 함수를 파라미터로 호출할 수 있습니다.

this.setState((state) => ({ list: state.list.concat(newObj) }))

또는 ES5:

this.setState(function(state) {
  return {
   list: state.list.concat(newObj)
  }
})

2016년 갱신

ES6에서는 다음을 사용할 수 있습니다.

this.setState({ list: [...this.state.list, ...newObject] });

react docs(https://facebook.github.io/react/docs/state-and-lifecycle.html#state-updates-may-be-asynchronous)에서 참조).

this.props와 this.state는 비동기적으로 갱신될 수 있으므로 다음 상태를 계산할 때 이들 값에 의존해서는 안 됩니다.

그 대신 다음을 수행해야 합니다.

this.setState((prevState) => ({
  contacts: prevState.contacts.concat([contact])
}));

언급URL : https://stackoverflow.com/questions/23966438/what-is-the-preferred-way-to-mutate-a-react-state