Vuex. 구성 요소가 시작되기 전에 API에서 데이터를받은 후 렌더링하는 방법

Question

Vuex의 렌더링 데이터에 문제가 있습니다. 나는 컴포넌트를 마운트하기 전에 API 호출을하고 있는데 for for loop에 대답을 렌더링 할 것이다. 그러나 데이터가 반환되기 전에 '계산 된'후크가 트리거되고 렌더링되지 않습니다 (정의되지 않은 렌더링). AngularJS 또는 이와 유사한 일부 기능을 좀 해결 찾고 있습니다.
Google은 React에서 비동기 데이터 수신 방법이 redux-saga를 통해 구현되었음을 알게되었습니다. 그러나 Vue에서 어떤 문제를 다룰 수있는 실용적인 예는 찾을 수 없습니다.
P. 난 그냥 내가 몇 가지 세부 사항에서 잘못 될 수있다 뷰를 배우기 시작하고있어, 어떤 조언은

<div class="form-group"> 
         <label for="ua">Choose appropriate user-agent</label> 
         <select v-model="selectedUA" class="form-control" id="ua"> 
          <option disabled value="">Please select one</option> 
          <option v-for="option in uaOptions" :value.sync="option.ua"> 
           {{ option.name }} 
          </option> 
         </select> 
        </div> 
    <script> 
     module.exports = { 
     beforeMount() { 
      this.$store.dispatch('proxyList') 
     }, 
     computed: { 
      proxyOptions() { 
      return this.$store.state.proxies 
      } 
     } 
     } 
    </script> 

uaOptions 내가 성공적인 API 호출 후 렌더링 싶어 하나의 데이터입니다) = 나를 위해 도움이 될 것입니다.

는

const actions = { 
    proxyList(context) { 
    return api.get(appConfig.serverAddress + '/get-countries') 
     .then((response) => context.commit('PROXIES_SUCCESS', response)) 
     .catch((error) => context.commit('PROXIES_FAILURE', error)) 
    } 
} 

actions.js이

const mutations = { 
    [types.PROXIES_SUCCESS](state, payload) { 
    state.proxies = payload 
    state.proxyInitError = false 
    }, 
    [types.PROXIES_FAILURE](state, payload) { 
    state.proxies = payload 
    state.proxyInitError = true 
    } 
} 

Answer 1

난 당신이 요구하는 것을 이해하지만, 어쩌면 당신이 사용 시도해야 확실하지 V-IF = "someVariable"mutation.js 인이됩니다 someVariable이 'undefined'가 아닌 경우에만 목록이 렌더링되도록하여 오류 메시지를 피할 수 있습니다.