Vuex가 이미 설정된 상태를 재설정하고 있습니다.

Vuex가 이미 설정된 상태를 재설정하고 있습니다.

Vuex와 장난을 치기 시작했는데 좀 혼란스러워.

액션을 트리거합니다.GET_RECRUITERS컴포넌트를 로드할 때마다company.vueapi-call도 할 수 있습니다.

예를 들어,company.vue=> 로 이동합니다.user/edit.vue와 함께vue-router다시 돌아가면 액션/api가 호출됩니다(구입자는 Vue-dev-tools에 따라 스토어에 저장됩니다).

틀렸으면 정정해주세요- 다시 페이지로 돌아가도 액션/api가 트리거되어 상태가 리셋되지 않습니다.아니면 제가 Vuex의 의도를 잘못 이해한 걸까요?

회사.표시하다

<template>
  <card>

    <select>
      <option v-for="recruiter in recruiters"
              :value="recruiter.id">
        {{ recruiter.name }}
      </option>
    </select>

  </card>
</template>

<script>
import { mapGetters } from 'vuex'

export default {
  middleware: 'auth',

  mounted() {
    this.$store.dispatch("company/GET_RECRUITERS")
  },

  computed: mapGetters({
    recruiters: 'company/recruiters'
  }),

}
</script>

company.company.company.company.

import axios from 'axios'

// state
export const state = {
  recruiters: [],
}

// getters
export const getters = {
  recruiters: state => { 
    return state.recruiters
  }
}

// actions
export const actions = {
  GET_RECRUITERS(context) {

    axios.get("api/recruiters")
      .then((response) => {
        console.log('API Action GET_RECRUITERS')
        context.commit("GET_RECRUITERS", response.data.data) 
      })
      .catch(() => { console.log("Error........") })
  }

}

// mutations
export const mutations = {
  GET_RECRUITERS(state, data) {
    return state.recruiters = data
  }
}

감사합니다!

페이지 구성요소를 캐시하지 않는 한 다시 라우트할 때마다 페이지 구성요소가 다시 작성/마운트되기 때문에 이는 예상된 동작입니다.이를 위한 몇 가지 설계 패턴을 다음에 나타냅니다.

• 한 번만 실행되는 App.vue에 데이터를 로드합니다.

• 또는 API를 호출하기 전에 데이터가 아직 로드되지 않았는지 확인하십시오.

// Testing that your `recruiters` getter has no length before loading data
mounted() {
   if(!this.recruiters.length) {
      this.$store.dispatch("company/GET_RECRUITERS");
   }
}

• 또는 페이지 구성요소를 캐시하여 전송했다가 다시 라우트할 때마다 페이지 구성요소가 다시 작성되지 않도록 하십시오.를 사용하여 이를 수행합니다.<keep-alive>랩하는 컴포넌트<router-view>:

<keep-alive>
   <router-view :key="$route.fullPath"></router-view>
</keep-alive>

언급URL : https://stackoverflow.com/questions/65659570/vuex-is-resetting-already-set-states