programing

vuex 스토어 보기

prostudy 2022. 5. 14. 22:28
반응형

vuex 스토어 보기

나는 다음과 같은 가게를 가지고 있다.

마이스토어.부에를 하다

export default {
  namespaced:true,
  state: {
    data: [],
  }
  // actions, mutations, etc
}

새 데이터가 언제 매장에 도착하는지 알고 싶다.

MyOtherVue 파일.부에를 하다

export default {
  computed: {
    getFoo() {
      return this.$store.state.MyStore.data;
    },
  },
  watch: {
    getFoo(newValue, oldValue) {
      console.log(`New ${JSON.stringify(newValue)}`);
      console.log(`Old ${JSON.stringify(oldValue)}`);
    }
  },
}

그러나 콘솔은 항상 새 데이터와 오래된 데이터를 동일한 개체로 표시한다.이것이 그렇게 하는 정확한 구문인가?

FYI - 새 항목이 vuex 저장소 데이터에 추가될 때 캡처해야 하며, OpenLayers 맵에 직접 추가하려고 한다.

나는 그것을 통해 해결했다.

this.$store.subscribe((mutation,state) => {
  if (mutation.type === 'myStore/MyMutation') {
    const myData = mutation.payload.data.forEach(x=> etc...
  }
});

다음과 같은 상점 자산을 직접 볼 수 있다.

watch:{
  '$store.state.data'(value, oldValue) {
  }
}

또한 '딥' 및 '핸들러' 구문을 사용하여 개체의 하위 속성을 볼 수도 있다.

배열에 대한 이전 데이터를 원하는 경우 감시 핸들러에 깊고 얕은 복사본을 만들어 구성 요소에 보관해야 한다.

불행히도 개체와 어레이로 작업할 때 실제 개체가 변경되지 않는 한(변경, 변형이 아닌) 개체의 이전 상태를 새로운 상태로 볼 수 없게 된다.

참조URL: https://stackoverflow.com/questions/54870454/watching-a-vuex-store

반응형