溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章將為大家詳細講解有關vue組件內如何獲取actions的response方式，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。
Vue是一款友好的、多用途且高性能的JavaScript框架，使用vue可以創建可維護性和可測試性更強的代碼庫，Vue允許可以將一個網頁分割成可復用的組件，每個組件都包含屬于自己的HTML、CSS、JavaScript，以用來渲染網頁中相應的地方，所以越來越多的前端開發者使用vue。
最近使用在學習使用vuex，想利用vuex集中管理狀態。在和后臺進行數據交互的時候，必然會涉及接口的調用，此類異步操作，通常寫在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異步的特性，可以在子組件中獲取到接口調用成功后返回的參數：
export default {
......
created: function() {
this.$store.dispatch('getComplete').then(response => {
......
}).catch(response => {
......
})
}
}除了這種方式，也可以使用mapActions 輔助函數將組件的 methods 映射為 store.dispatch 調用（需要先在根節點注入 store）。
關于“vue組件內如何獲取actions的response方式”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
