在Vue組件化中利用axios處理ajax請求的使用方法
更新時間：2017年08月25日 09:04:46 作者：安小下
這篇文章主要給大家介紹了在Vue組件化中利用axios處理ajax請求的使用方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面跟著小編來一起學(xué)習(xí)學(xué)習(xí)吧。
本文主要給大家介紹了關(guān)于在Vue組件化中利用axios處理ajax請求的使用方法，分享出來供大家參考學(xué)習(xí)，下面話不多說了，來一起看看詳細(xì)的介紹吧。
推薦方式
首先在 main.js 中引入 axios
// 引入 axios import axios from 'axios'
這時候如果你想在其它的組件中使用axios進行ajax請求是或提示報錯的，報錯內(nèi)容大致是axios is undefined。
我們通常的決絕方案是將axios改寫為 Vue 的原型屬性,如2
將axios寫入Vue的原型鏈作為Vue的屬性
// 設(shè)置axios請求的默認(rèn)host axios.defaults.baseURL = "https://www.ifilm.ltd/api/" // 將axios綁定給vue成為一個屬性 Vue.prototype.$http = axios
在其他組件中使用axios
this.$http.get('路由').then(response => {
// todo something
})
此方式可以類比到Vue的其他庫使用
兩種不推薦的使用示范
將axios全局化，作為全局變量
// 引入axios import axios from 'axios' // 將axios全局化 window.axios = axios;
另外一個不太優(yōu)雅的方式就是在需要的每個組件中都引入對應(yīng)的庫
總結(jié)
以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對腳本之家的支持。
相關(guān)文章
前端報錯npm ERR! cb() never called!問題解決辦法
最近接手了一個前臺項目,執(zhí)行npm install的時候一直報錯,所以這里就給大家總結(jié)下,這篇文章主要給給大家介紹了關(guān)于前端報錯npm?ERR! cb() never called!問題的解決辦法,需要的朋友可以參考下2024-05-05
今天小編就為大家分享一篇Vue中保存數(shù)據(jù)到磁盤文件的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
vue.js數(shù)據(jù)響應(yīng)式原理解析
這篇文章主要介紹了vue.js數(shù)據(jù)響應(yīng)式原理解析，文章圍繞主題展開詳細(xì)的內(nèi)容介紹，具有一定的參考價值，需要的朋友可以參考一下2022-08-08
vue實現(xiàn)頂部導(dǎo)航欄以及跳轉(zhuǎn)
這篇文章主要介紹了vue實現(xiàn)頂部導(dǎo)航欄以及跳轉(zhuǎn)方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-09-09
在Vue框架中我們經(jīng)常需要綁定各種JS事件,如"點擊事件"、"鼠標(biāo)移動事件"、"鍵盤事件"等等,這篇文章主要給大家介紹了關(guān)于Vue鼠標(biāo)點擊事件和鍵盤事件的相關(guān)資料,需要的朋友可以參考下2024-01-01
這篇文章主要給大家介紹了關(guān)于vue將某個組件打包成js并在其他項目使用的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對大家具有一定的參考借鑒價值,需要的朋友可以參考下2023-07-07
這篇文章主要為大家詳細(xì)介紹了vue實現(xiàn)全選、反選功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-06-06
這篇文章主要介紹了解決vue過濾器filters獲取不到this對象的問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-01-01
Vue監(jiān)聽頁面變化的實現(xiàn)方法小結(jié)
在Vue.js應(yīng)用開發(fā)過程中,監(jiān)聽頁面變化是一個非常常見的需求,無論是為了響應(yīng)用戶交互、優(yōu)化性能,還是實現(xiàn)復(fù)雜的業(yè)務(wù)邏輯,監(jiān)聽頁面變化的能力都是不可或缺的,本文將詳細(xì)介紹如何在Vue項目中實現(xiàn)頁面變化監(jiān)聽,需要的朋友可以參考下2024-10-10
解決Antd中Form表單的onChange事件中執(zhí)行setFieldsValue不生效
這篇文章主要介紹了解決Antd中Form表單的onChange事件中執(zhí)行setFieldsValue不生效問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-03-03