programing

값이 완전히 업데이트되기 전에 Vue 3 워치가 호출됩니다.

firstcheck 2022. 8. 1. 21:26
반응형

값이 완전히 업데이트되기 전에 Vue 3 워치가 호출됩니다.

저는 제 첫 번째 Vue 3(그리고 vuex 4) 앱을 만들고 있습니다.Vue 2의 배경은 꽤 탄탄합니다.

vuex 액션을 통해 데이터를 로드한 다음 반환된 값을 통해 저장소에 액세스하는 구성 요소가 있습니다.setup()

  setup() {
    const store = useStore();
    const fancy = computed(() => store.state.fancy);
    return { fancy };
  },

fancy여기 깊게 내포된 물체가 있는데, 중요한 것 같습니다.

그런 다음 값이 변경될 때마다 함수를 실행하고 싶기 때문에 이 기능을 설정했습니다.watch내 안에서mounted()라이프 사이클 훅

 watch(
      this.fancy,
      (newValue) => {
        for (const spreadsheet in newValue) {
          console.log(Object.keys(newValue[spreadsheet].data))
          setTimeout(()=>{
            console.log(Object.keys(newValue[spreadsheet].data))
          },500)
          ...

새로운 것을 사용해 보았습니다.onMounted()후크 인 셋업 및watchEffect그리고.store.watch대신 watch/watch Effect를 on Mounted 훅에서 확실하게 트리거할 수 없었고 watch Effect는 계산된 스토어 값에 따라 업데이트되지 않은 것 같습니다.만약 당신이 이것에 대한 통찰력을 가지고 있다면, 그것은 편리할 것입니다.

그러나 나의 진짜 문제는 값이 업데이트되기 전에 워처가 호출된다는 것입니다.예를 들어 내 코드가 로그아웃된다.[]첫 번째 키 세트에 대해, 그리고 0.5초 후에 전체 배열에 대해 설명합니다.만약 그것이 일종의 점진적인 데이터 입력이었다면, 나는 새로운 감시자를 다시 부를 것이라고 예상했을 것이다.newValue저도 노력했어요.모든 배열flush,deep,그리고.immediate내 감시자에게 부탁했지만 소용없었어 nextTick()에서도 동작하지 않았습니다.새로운 반응도 변화에 대한 저의 이해 부족과 관련이 있다고 생각합니다만, 어떻게 대처해야 할지 모르겠고, 앱에 랜덤 지연을 추가하는 것은 분명히 잘못된 것 같습니다.

감사합니다.

언급URL : https://stackoverflow.com/questions/64341962/vue-3-watch-being-called-before-value-is-fully-updated

반응형