javascript - vue에서 상태 값 변경

Question

액션이 비동기 처리를 처리하지 않는다는 것을 알고 있습니다. 즉, 버튼을 클릭한 후 액션이나 변형을 거치지 않고 메서드의 상태 값을 직접 변경할 수 있다는 것입니다. Vue의 사양은?

Answer 1

mutation 메소드를 직접 호출하거나 state 속성을 직접 수정할 수 없는데 왜 commit을 통해 mutation을 제출해야 하는지에 대해? 공식 문서 인용:

다시 한 번, 상태 변경을 더 명확하게 추적하기 위해 store.state.count를 직접 변경하는 대신 변형을 제출합니다. 이 간단한 규칙을 통해 의도가 더 명확해지기 때문에 코드를 읽을 때 애플리케이션 내에서 상태 변경을 더 쉽게 해석할 수 있습니다. 또한 이는 모든 상태 변경을 기록하고 상태 스냅샷을 저장할 수 있는 일부 디버깅 도구를 구현할 수 있는 기회도 제공합니다. 이를 통해 우리는 시간 여행과 같은 디버깅 경험을 얻을 수도 있습니다.
스토어의 상태는 반응형이기 때문에 컴포넌트에서 스토어의 상태를 호출하는 것은 계산된 속성에서 반환하는 것만큼 간단합니다. 변경 사항을 트리거하는 것은 구성 요소의 메서드에 돌연변이를 제출하는 것뿐입니다.

vuex를 설계할 때 상태 변경을 추적하려면 커밋을 사용하여 돌연변이로 인해 발생한 데이터의 변경 사항을 제출해야 한다는 점에 동의한 것을 볼 수 있습니다. Vue Devtools라는 공식 Vue 디버깅 플러그인을 사용해 볼 수 있으며, 컴포넌트, 데이터, vuex 등을 직접 볼 수 있으며, 변경 사항을 추적할 수도 있습니다.