저장소 값을 직접 업데이트하면 안되는 이유는 무엇입니까?

동작을 디스패치하는 대신 저장소 값을 직접 업데이트하면 어떻게됩니까? 다음은 예시적인 코드저장소 값을 직접 업데이트하면 안되는 이유는 무엇입니까?

import actions from '../actions' 

class Example extends Component { 

    static contextTypes = { 
     store: PropTypes.any, 
    } 

    static propTypes = { 
     drawer: PropTypes.object, 
    } 

    componentDidMount() { 
     const { drawer } = this.props 
     const { store } = this.context 

     // I can update 'drawer' values directly and "it works" as following 
     // drawer.unread -= 1 

     // Also I can update 'drawer' values by dispatching an action as following 
     drawer.unread -= 1 
     this.context.store.dispatch(actions.updateDrawer(drawer)) 
    } 

} 


function mapStateToProps(state) { 
    return { 
     drawer: state.drawer, 
    } 
} 


export default connect(mapStateToProps)(Example)

출처

2017-11-08 efkan

'uiObjectProp' 변경시 다시 렌더링하려는 다른 구성 요소가 있기 때문에 디스패치를 사용하지 않는 한 변경되지 않습니다. 국가는 실제로 변하지 않을 것입니다. – Daniel

나는 그렇게 생각했다. 그러나 그들은 바뀐다. 내가 만난 상황이 예외적인지 아닌지 궁금합니다. 내 질문을 업데이트 할게. – efkan

@efkan, 흥미 롭습니다. 내 응용 프로그램의 저장소에 포함 된 깊게 중첩 된 객체를 사용해 보았습니다. 아무 것도 일어나지 않았으며 docs에 따라 "내부에서 상태를 변경하는 유일한 방법은 그것에 작업을 전달하는 것입니다." 나는 주위를 바이올린 할 것이다! – semuzaboi

상태가 변화되지만, 어떤 구성 요소는 변경 통지되지 않는다.

또한 일부 최적화 (예 : React.PureComponent)는 얕은 참조 동일성을 사용하여 상태의 변경 사항을 감지 할 수 있다고 가정합니다. 직접 할당하면 가정이 깨집니다.

출처

2017-11-10 07:24:34

그러나 내 서랍 구성 요소가 변경됩니다. 또한 더 깊은 중첩 된 개체를 업데이트하려고 시도하지 않습니다. 어쩌면 첫 번째 수준 개체 (서랍 같은 : {읽지 않은 : 3})에서만 작동합니다. – efkan

저장소 값을 직접 업데이트하면 안되는 이유는 무엇입니까?

답변

관련 문제