2016-11-18 5 views
3

바이올린 : here나는 Vuex에 게터에서 파견 할 수

내가 Vuex와 뷰 2와 웹 애플리케이션을 만드는 오전. getter에서 상태 데이터를 가져 오려는 저장소가 있습니다. getter가 데이터가 채워지지 않은 것으로 확인되면 dispatch를 호출하고 데이터를 가져옵니다. 다음

내 Vuex 저장소입니다 :

const state = { 
    pets: [] 
}; 

const mutations = { 
    SET_PETS (state, response) { 
    state.pets = response; 
    } 
}; 

const actions = { 
FETCH_PETS: (state) => { 
     setTimeout(function() { 
      state.commit('SET_PETS', ['t7m12qbvb/apple_9', '6pat9znxz/1448127928_kiwi']) 
    }, 1000) 
} 
} 

const getters = { 
    pets(state){ 
    if(!state.pets.length){ 
     state.dispatch("FETCH_PETS") 
    } 
    return state.pets 
    } 
} 

const store = new Vuex.Store({ 
    state, 
    mutations, 
    actions, 
    getters 
}); 

그러나 나는 다음과 같은 오류 얻고있다 : 나는 뷰 구성 요소의 beforeMount에서이 작업을 수행 할 수 있습니다 알고

Uncaught TypeError: state.dispatch is not a function(…)

을,하지만 난 여러 구성 요소를 가지고있는 동일한 Vuex 저장소를 사용하므로 다른 구성 요소에 어떤 영향을 미치는지 파악해야합니다. 그들이

조치가 컨텍스트를 전달로 위탁, 파견, 상태를 호출 할 수있는 상점의 state하지 context 전달로

답변

1

게터 파견을 호출 할 수 없습니다.

Getter는 '파생 상태'를 관리하는 데 사용됩니다. 1. 경우

당신 대신 당신이 당신의 응용 프로그램의 루트에서 FETCH_PETS를 호출하고, 두 가지를 회신에 대한 게터에 대한

+0

감사의 필요성을 제거하는 것을 필요로하는 구성 요소에 pets 상태를 설정 한 경우 애완 동물을 사용하는 구성 요소가 여러 개 있습니다. 구성 요소를 가져와야하는데,이 작업을 수행 할 수있는 중앙 위치는 무엇입니까? 2. 이와 마찬가지로 이것은 계산에서도 수행 할 수 없습니까? – Saurabh

+0

1. vuex는 중앙 저장소이므로 계산 된 속성 즉, {calculate this} {return this. $ store.state.pets}} '를 통해 앱의 루트에 저장소를 전달할 수 있습니다. 이것을 허용합니다. 2. 앱 루트의 마운트 된 메서드를 사용할 수 있지만 계산 된 속성을 사용하여 vuex에 비동기 업데이트를하지는 않습니다. 대신 그들은 위의 것처럼 저장소를보고 비동기 작업이 완료되고 커밋이 새로운 애완 동물 데이터를 통과 할 때 업데이트 될 수 있습니다. – GuyC

+0

포인트 1을 명확히합니다. 앱 루트에서 비동기 vuex dispatch()를 실행하거나 애완 동물 객체가 처음 필요하면 논리적으로 호출되는 구성 요소를 실행합니다. 정확히 파악하기 힘든 앱 구조를 보지 않고도 말이 될만한 위치를 찾을 수있을 것이라고 확신합니다. – GuyC