vuex 상태가 변경 시 UI를 업데이트하지 않음

vuex 상태가 변경 시 UI를 업데이트하지 않음

vue2를 vue3 프로젝트로 변환하는 중에 vuex 스토어의 개체가 업데이트될 때 UI가 업데이트되지 않습니다.내 스토어를 만드는 방법은 다음과 같습니다.

store/index.js

import {mutations} from './mutations';
import {createStore} from 'vuex'

export default createStore({
  state() {
    return {
       ...
    }
   },
   mutations
});

돌연변이.js

export const mutations = {
  narrative(state, v) {
    state.narrative = v;
  }
};

app.js

import { createApp } from 'vue';
import store from './store/index';

const app = createApp({
  mixins: [
    require('./mixins/base')
  ]
}).use(store)

따라서 vuex 개체 중 하나를 변환하면 즉시 콘솔 로그에 기록하고 데이터가 변경된 것을 확인합니다.

        let narrative = _.find(this.$store.state.narratives, ['id', this.selectedNarrativeId]);
        if (narrative) {
          console.log(narrative.id); // PRINTS CORRECT UPDATED ID
          this.$store.commit('narrative', narrative);
          console.log(this.$store.state.narrative.id); // PRINTS CORRECT UPDATED ID
        }

그러나 UI는 변경되지 않습니다.그러나 계산된 속성을 사용하면 UI가 즉시 업데이트됩니다.제가 vuex 스토어에서 무엇을 잘못하고 있습니까?

computed: {
    currentNarrative() {
        let narrative = _.find(this.$store.state.narratives, ['id', this.selectedNarrativeId]);
        if (narrative) {
          return narrative;
        }
        return {};
      },
}

버전

• 값 3.2.33
• vuex 4.0.2

교체require어느 정도로import컴퓨터를 재부팅하면 문제가 해결되었습니다. 일부 손상된 부분이 서버에서 여전히 실행되고 있을 수 있습니다.

언급URL : https://stackoverflow.com/questions/72129609/vuex-state-not-updating-ui-on-change