programing

Vue.js - Vuex Store의 변환 내부에서 라우터 제어

javajsp 2023. 6. 23. 21:46

Vue.js - Vuex Store의 변환 내부에서 라우터 제어

다음과 같은 문제가 있습니다.

이것은 나의 돌연변이 중 하나입니다.

tryAutoLogin(state) {
  console.log("Trying auto login...");
  const token = window.localStorage.getItem("token");
  if (!token) {
    return;
  }
  const expirationDate = window.localStorage.getItem("token_exp");
  const now = new Date();
  if (now >= expirationDate) {
    return;
  }
  state.userData.loggedIn = true;
  state.userData.username = token.identity;
  // desired: this.$router.push("/dashboard") => results in undefined
}

현재 저는 구성 요소의 생성 단계에서 구성 요소 내부에서 이 변환을 수행합니다.

  created() {
    this.$store.commit("tryAutoLogin");
    this.$router.push("/dashboard");
  }

값을 출력하고 변수에 저장한 후 이를 사용해야 하기 때문에 이 방법은 적합하지 않습니다.this.$router.push("/dashboard").

어떻게 하면 우아하게 해결할 수 있을까요?돌연변이의 내부에 유리한 것처럼.// desired댓글.Vuex 스토어 안에 있는 라우터에 액세스할 수 있는 방법이 있습니까?

다음과 같이 vue 구성 요소 인스턴스를 변환에 전달합니다.

 this.$store.commit("tryAutoLogin",this);
 

변환에서 매개 변수로 추가vm그러면 그것을 로 사용합니다.vm.$router.push("/dashboard") :

tryAutoLogin(state,vm) {
  console.log("Trying auto login...");
  const token = window.localStorage.getItem("token");
  if (!token) {
    return;
  }
  const expirationDate = window.localStorage.getItem("token_exp");
  const now = new Date();
  if (now >= expirationDate) {
    return;
  }
  state.userData.loggedIn = true;
  state.userData.username = token.identity;
  vm.$router.push("/dashboard") 
}

언급URL : https://stackoverflow.com/questions/63538091/vue-js-control-the-router-from-inside-a-mutation-in-vuex-store