programing

VueJS - 페이지를 다시 로드한 후 mapState의 값을 데이터 속성에 할당할 수 없음

prostudy 2022. 5. 25. 22:18
반응형

VueJS - 페이지를 다시 로드한 후 mapState의 값을 데이터 속성에 할당할 수 없음

페이지를 다시 로드한 후 mapState에서 데이터 속성에 값을 할당할 수 없음, 하위 페이지로 이동하면 작동하지만 이미 하위 페이지에 서서 브라우저를 다시 로드한 경우에는 작동하지 않음.

계산된 map

computed: {
  ...mapState({
    tsStore: state => state.SchemeStore
  })
}

데이터 속성

data () {
  return {
    works: '',
    offTime: '',
  }
}

장착됨

if (this.tsStore.singleView) {
  // Set data based on api.
  let single = this.tsStore.singleView
  this.works = single.works
  this.offTime = single.offTime
}

재로드 후works그리고offTime데이터 속성이 비다

네, 문제는...state구성 요소가 설치된 후 업데이트됨mounted; 그래서, 그updated대신 메소드를 호출하다mounted. API 호출이 에 의해 시뮬레이션되는 이 바이올린에서 볼 수 있다.setTimeout:

https://jsfiddle.net/eywraw8t/369915/

구성 요소를 업데이트하는 가장 좋은 방법은computed propertiesVue는 다음과 같은 변경을 감시하기 위해 프록시를 구현한다.

https://jsfiddle.net/3mn2xgvr/

나는 Vuex의 상태가 변경되면 그에 따라 달라지는 모든 데이터가 변경되도록 변경 사항을 계산된 속성으로 이동했다.

참조URL: https://stackoverflow.com/questions/52353370/vuejs-cant-assign-value-from-mapstate-to-data-property-after-reloading-the-pa

반응형