vue 組件內(nèi)獲取actions的response方式
更新時(shí)間：2019年11月08日 10:16:35 作者：MRblackLu
今天小編就為大家分享一篇vue 組件內(nèi)獲取actions的response方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
最近使用在學(xué)習(xí)使用vuex，想利用vuex集中管理狀態(tài)。在和后臺(tái)進(jìn)行數(shù)據(jù)交互的時(shí)候，必然會(huì)涉及接口的調(diào)用，此類異步操作，通常寫在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
})
這里將接口的請(qǐng)求放置在promise中，利用promise異步的特性，可以在子組件中獲取到接口調(diào)用成功后返回的參數(shù)：
export default {
......
created: function() {
this.$store.dispatch('getComplete').then(response => {
......
}).catch(response => {
......
})
}
}
除了這種方式，也可以使用mapActions 輔助函數(shù)將組件的 methods 映射為 store.dispatch 調(diào)用（需要先在根節(jié)點(diǎn)注入 store），具體使用方式詳見(jiàn)：
傳送門：https://vuex.vuejs.org/en/actions.html
以上這篇vue 組件內(nèi)獲取actions的response方式就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
關(guān)于vue項(xiàng)目一直出現(xiàn) sockjs-node/info?t=XX的解決辦法
sockjs-node 是一個(gè)JavaScript庫(kù),提供跨瀏覽器JavaScript的API,創(chuàng)建了一個(gè)低延遲、全雙工的瀏覽器和web服務(wù)器之間通信通道,這篇文章主要介紹了vue項(xiàng)目一直出現(xiàn) sockjs-node/info?t=XX的解決辦法,需要的朋友可以參考下2023-12-12
vue?如何刪除數(shù)組中的某一條數(shù)據(jù)
這篇文章主要介紹了vue?如何刪除數(shù)組中的某一條數(shù)據(jù)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-08-08
這篇文章主要為大家詳細(xì)介紹了Vue實(shí)現(xiàn)牌面翻轉(zhuǎn)效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-07-07
vue中想要mock數(shù)據(jù)在線上環(huán)境生效如何操作
本文主要介紹了在配置了mock數(shù)據(jù)之后在線上環(huán)境使用,主要通過(guò)在main.ts文件中注冊(cè)和vite.config.ts文件夾中配置插件來(lái)實(shí)現(xiàn),感興趣的可以了解一下2025-01-01
在vue中利用全局路由鉤子給url統(tǒng)一添加公共參數(shù)的例子
今天小編就為大家分享一篇在vue中利用全局路由鉤子給url統(tǒng)一添加公共參數(shù)的例子，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-11-11
這篇文章主要給大家介紹了關(guān)于如何利用VUE創(chuàng)建視頻流應(yīng)用的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2022-03-03
使用Vue封裝一個(gè)可隨時(shí)暫停啟動(dòng)無(wú)需擔(dān)心副作用的定時(shí)器
這篇文章主要為大家詳細(xì)介紹了如何使用Vue封裝一個(gè)可隨時(shí)暫停啟動(dòng)無(wú)需擔(dān)心副作用的定時(shí)器,感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-11-11
在使用?element?ui?組件過(guò)程中，我最近碰到了新的問(wèn)題，vue--elementui中如何修改el-input樣式呢，今天小編通過(guò)示例代碼給大家詳細(xì)講解，需要的朋友參考下吧2023-05-05
這篇文章主要介紹了vue 2.0組件與v-model的相關(guān)資料，文中介紹的非常詳細(xì)，本文適合初學(xué)組件編寫的同學(xué)閱讀，需要的朋友可以參考借鑒，下面來(lái)一起看看吧。2017-03-03
Typescript 5年內(nèi)的熱度隨時(shí)間變化的趨勢(shì)，整體呈現(xiàn)一個(gè)上升的趨勢(shì)。也說(shuō)明ts越來(lái)越️受大家的關(guān)注了。這篇文章主要介紹了Vue 中使用 typescript的方法詳解,需要的朋友可以參考下2020-02-02