vue 組件內獲取actions的response方式
更新時間：2019年11月08日 10:16:35 作者：MRblackLu
今天小編就為大家分享一篇vue 組件內獲取actions的response方式，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
最近使用在學習使用vuex，想利用vuex集中管理狀態(tài)。在和后臺進行數(shù)據(jù)交互的時候，必然會涉及接口的調用，此類異步操作，通常寫在action里面：
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use('Vuex');
const actions = {
getComplete ({}) {
return new Promise((resolve, reject) => {
Vue.http.get('XXXXXX').then((response) => {
resolve(response);
}).catch((response) => {
reject(response);
});
});
}
}
export default new Vuex.Store({
actions
})
這里將接口的請求放置在promise中，利用promise異步的特性，可以在子組件中獲取到接口調用成功后返回的參數(shù)：
export default {
......
created: function() {
this.$store.dispatch('getComplete').then(response => {
......
}).catch(response => {
......
})
}
}
除了這種方式，也可以使用mapActions 輔助函數(shù)將組件的 methods 映射為 store.dispatch 調用（需要先在根節(jié)點注入 store），具體使用方式詳見：
傳送門：https://vuex.vuejs.org/en/actions.html
以上這篇vue 組件內獲取actions的response方式就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
這篇文章主要介紹了vue實現(xiàn)自定義樹形組件的示例代碼,本文通過示例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-08-08
vue3使用vuedraggable和grid實現(xiàn)自定義拖拽布局方式
這篇文章主要介紹了vue3使用vuedraggable和grid實現(xiàn)自定義拖拽布局方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-06-06
elementUI el-form 數(shù)據(jù)無法賦值且不報錯解決方法
本文主要介紹了elementUI el-form 數(shù)據(jù)無法賦值且不報錯解決方法,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2023-12-12
vue實現(xiàn)移動端輕量日期組件不依賴第三方庫的方法
這篇文章主要介紹了vue 移動端輕量日期組件不依賴第三方庫,需要的朋友可以參考下2019-04-04
本文主要介紹了el-form表單實現(xiàn)校驗的示例代碼,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2024-07-07
ElementUI實現(xiàn)el-table列寬自適應的代碼詳解
這篇文章給大家介紹了ElementUI實現(xiàn)el-table列寬自適應的詳細步驟,文中通過代碼示例給大家介紹的非常詳細,對大家的學習或工作有一定的幫助,需要的朋友可以參考下2024-01-01
這篇文章主要介紹了Vue組件跨層級獲取組件操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
這篇文章主要介紹了vue3中vue-meta的使用方法，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-06-06
這篇文章主要介紹了vue中then后的返回值解析，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要為大家詳細介紹了vue實現(xiàn)驗證用戶名是否可用，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-01-01