Vuex - 동작에만 변이를 표시합니다.

Question

Vuex를 사용하여 내 클라이언트 - 서버 통신에 대한 상태를 저장하고 싶습니다. 검색 논리 :

// status is either synching|synched|error 
state: { query:"", result:[], status:"synching" } 

검색 작업을 구현합니다. 작업은 돌연변이를 통해 상태를 수정할 수 있습니다

그러나

function search(context, query) { 
    context.commit("query", query); 
    context.commit("status", "synching"); 

    // some asynch logic here 
    ... 
     context.commit("result", result); 
     context.commit("status", "synched"); 
    ... 
} 

, 이제 돌연변이뿐만 아니라 내 구성 요소에 노출되어, 그들은 지금 내 상태가 일치 할 수 있습니다. 구성 요소로부터 돌연변이를 숨길 수 있습니까?

Answer 1

작업이 상태를 직접 변경할 수 있습니다. 나중에 다른 방법을 사용할 필요가없는 다른 것을 만들 필요가 없습니다. 행동을 직접 사용하십시오.

var store = new Vuex({ 
    state: { 
    something: '' 
    }, 
    actions: { 
    async updateSomethingAsynchronnousWay ({state}, payload) { 
     var response = await axios.get(payload.src) 
     state.something = response.data.anyKey 
    } 
    } 
}) 

new Vue({ 
    store 
    el: '#app', 
    created() { 
    this.$store.dispatch({ 
     type: 'updateSomethingAsynchronnousWay, 
     src: 'https//your.rest.api/something' 
    }) 
    } 
})