programing

Vuex TypeScript에서 문자열이 업데이트되지 않지만 어레이가 업데이트됨

bestcode 2022. 9. 28. 00:14
반응형

Vuex TypeScript에서 문자열이 업데이트되지 않지만 어레이가 업데이트됨

저는 현재 vue와 함께 일하고 있습니다.저장소에서 배열을 업데이트하고 있지만 문자열이나 부울은 업데이트되지 않습니다.

암호는 다음과 같습니다.

1초마다 문자열을 커밋해도 프런트엔드에 문자열이 표시되지 않음(vuex dev 툴은 상태가 올바르고 콘솔로그는 표시되지 않음)

My Store는 다음과 같습니다.

const state: State = {
  cars: [],
  date: "false",
  carsCounter: 0,
};

내보내기:

const getters = {
  getCars(state: State) {
    return state.cars;
  },
  getDate(state: State) {
    return state.date;
  },
  getCarsCounter(state: State) {
    return state.carsCounter;
  }
};

const { read, commit, dispatch } = getStoreAccessors<State, State>("");

export const readCarsFromSse = read(getters.getCars);
export const readDate = read(getters.getDate);
export const readCarsCounter = read(getters.getCarsCounter);

날짜 구성 요소에는 다음과 같이 사용합니다.

export default class DateVue extends Vue {
  date = readDate(store);
  cars = readCarsFromSse(store);
  testString = readCarsCounter(store);

  mounted() {
    Timeloader.loadTime();
  }

}

스트링이 업데이트되지 않았는데 배열이 업데이트되는 이유를 아는 사람이 있습니까?

감사합니다.

스트링이 업데이트되지 않았는데 배열이 업데이트되는 이유를 아는 사람이 있습니까?

뷰에서는 영향을 한 번 사용하여 Vuex 상태에서 값을 가져옵니다.어레이를 가져오면 Vuex가 어레이의 옵서버를 반환하고 항목 값이 최신 상태로 유지됩니다.하지만 원시적 가치는 원시적 가치일 뿐입니다.

vuex 클래스를 사용하는 솔루션은 다음과 같습니다.

설치하다vuex-class:

npm install vuex-class

그 후, 다음과 같이 입력합니다.

import { Component, Vue } from "vue-property-decorator";
import { Getter } from "vuex-class";

@Component
export default class DateVue extends Vue {
  @Getter("getDate")
  date!: string;
  @Getter("getCars")
  cars!: any[];
  @Getter("getCarsCounter")
  testString!: number;

  mounted() {
    Timeloader.loadTime();
  }
}

vuex 클래스(auryn31에서 제공하는 솔루션)가 없는 경우:

export default class DateVue extends Vue {
  get date() { return readDate(store); }
  // etc.
}

언급URL : https://stackoverflow.com/questions/57108848/vuex-typescript-does-not-update-string-but-array

반응형