Vue.js [vuex]如何從突變派發？

我有一個我想應用於json對象的過濾器列表。Vue.js [vuex]如何從突變派發？

我的突變是這樣的：

const mutations = { 
    setStars(state, payload) { 
     state.stars = payload; 
     this.dispatch('filter'); 
    }, 

    setReviews(state, payload) { 
     state.reviews = payload; 
     this.dispatch('filter'); 
    } 
};

由於過濾器是如何工作的，我需要再重新申請他們都因爲我不能簡單地保持downfiltering清單，因爲這使我陷入麻煩時，用戶取消選擇過濾器選項。

因此，當對星號過濾器或評論過濾器（用戶正在過濾）發生突變時，我需要調用一個運行我所有過濾器的函數。

這裏最簡單的選擇是什麼？我可以添加某種助手功能還是可能設置一個調用實際篩選結果的突變的操作？

來源

2017-06-01 Stephan-v

當你需要返回過濾後的數據，沒有必要變異存儲。保持你的數據完好，並創建一個返回過濾數據的getter，或者是2個getters（每個case 1）或者一個接受參數（過濾條件）的getter。相關閱讀：https://vuex.vuejs.org/en/getters.html – wostex

@wostex我同意你，如果它只是一個過濾器，但我需要一次應用多個過濾器爲一個值。所以我不能單獨使用1或2個獲得者。他們需要一起工作。 –

吸氣劑可以調用另一個吸氣劑。 – wostex

突變不能調度進一步的動作，但動作可以調度其他動作。所以一種選擇是讓一個動作提交變化，然後觸發過濾器動作。

如果可能的話，另一種選擇是讓所有的過濾器都是getters，這些過濾器自然會對計算屬性等數據變化做出反應。

的調用其他動作的動作例：

// store.js 
export default { 
    mutations: { 
    setReviews(state, payload) { 
     state.reviews = payload 
    } 
    } 

    actions: { 
    filter() { 
     // ... 
    } 

    setReviews({ dispatch, commit }, payload) { 
     commit('setReviews', payload) 
     dispatch('filter'); 
    } 
    } 
} 


// Component.vue 
import { mapActions } from 'vuex'; 

export default { 
    methods: { 
    ...mapActions(['setReviews']), 
    foo() { 
     this.setReviews(...) 
    } 
    } 
}

來源

2017-06-01 14:07:26 Matt

因此，對於我所做的每個突變，我需要從我的Vue組件中直接調用一個調度？由於我無法從我的Vuex商店內的突變中調用某個動作？ –

@ Stephan-v我實際上會派發一個'setReviews'動作_index_突變。 _action_既可以提交'setReviews'突變並觸發'filter'動作。 – Matt

有道理。我如何正確地調用我的Vuex商店中的某個操作的另一個操作？ –

Vue.js [vuex]如何從突變派發？

回答

相關問題