programing

vue DevTools가 vuex 돌연변이를 자동으로 커밋하도록 하려면 어떻게 해야 합니까?

nicescript 2022. 8. 23. 23:43
반응형

vue DevTools가 vuex 돌연변이를 자동으로 커밋하도록 하려면 어떻게 해야 합니까?

이런 돌연변이가 보여요

그러나 아래쪽 화살표를 클릭해야만 실제로 커밋됩니다.앱 진행에 따라 자동으로 커밋하도록 하려면 어떻게 해야 하나요?

아래쪽 화살표("Commit All" 레이블)는 개발 도구의 Vuex 기록에서 돌연변이만 "커밋"합니다.이 돌연변이 기록을 통해 개별 돌연변이와 적용 당시의 상태를 검사할 수 있습니다.상태 스냅샷에 대한 디버깅 지원일 뿐입니다.

"Commit All"을 클릭하면 모든 변환 기록이 새 "Base State"로 압축됩니다.즉, 돌연변이 이력이 필요 이상으로 길면 폐기됩니다.그러나 이것은 Vuex 스토어에서 돌연변이를 커밋하는 것과는 관계가 없습니다.Vuex 저장소에는 항상 모든 돌연변이를 포함한 최신 상태가 포함됩니다.

따라서 아래쪽 화살표를 자동으로 클릭하는 것은 필요에 따라 명시적으로 제어해야 하는 디버깅 정보이기 때문에 요점을 알 수 없습니다.

저도 이런 행동을 했어요.이것이 당신의 문제에 해당될지는 모르겠지만, 해결 방법을 찾았을 때, 앞으로 누군가가 사용할 수 있도록 여기에 언급해야겠다고 생각했습니다.

조금도Vuex getters특정에 근거해 계산된다.stateVuex 인스턴스의 객체.getter무엇을 결정하다state기반이 되고 있는 오브젝트 중 하나1개일 경우에만 갱신할 수 있습니다.state기반이 되는 오브젝트는 어떤 식으로든 수정됩니다.이는 성능상의 이유로 수행되므로 상태 값이 변경될 때마다 모든 getter를 재계산할 필요가 없습니다.

제 경우, getter 초기화 시 존재하지 않았던 속성을 돌연변이가 수정했습니다.따라서 Vue 인스턴스는 getter를 갱신할 필요가 있음을 인식하지 못했습니다.돌연변이를 새로운 변이로 리셋함으로써Base State그 후, getter는 이 속성을 기반으로 해야 한다는 것을 인식했고, 그 후 속성이 변경될 때마다 반응적으로 업데이트되었습니다.

이 문제는 Vuex에 반항적인 속성을 추가하여 해결되었습니다.state첫 번째 예에서getter는 속성이 변경될 때마다 업데이트됩니다.

여기서 설명한 바와 같이

Vue에서는 루트 수준의 사후 대응 속성을 동적으로 추가할 수 없으므로 값이 비어 있더라도 모든 루트 수준의 사후 대응 데이터 속성을 사전에 선언하여 Vue 인스턴스를 초기화해야 합니다.

, 다음과 같은 것도 있습니다.

원하는 모든 필드를 미리 사용하여 상태를 초기화해 보는 것이 좋습니다.

이게 누군가에게 도움이 되길 바라!

언급URL : https://stackoverflow.com/questions/57572245/how-can-i-get-vue-devtools-to-automatically-commit-vuex-mutations

반응형