關(guān)于vue中的ajax請求和axios包問題
更新時間：2018年04月19日 17:26:14 作者：Baby_加油_
大家在vue中，經(jīng)常會用到數(shù)據(jù)請求問題，常用的有vue-resourse、axios ，今天小編給大家介紹下axios的post請求 ，感興趣的朋友跟隨腳本之家小編一起看看吧
在vue中，經(jīng)常會用到數(shù)據(jù)請求，常用的有：vue-resourse、axios
今天我說的是axios的post請求
github源文件及文檔地址：【https://github.com/axios/axios】
+ 首先，引入axios
CDN: <script src="https://unpkg.com/axios/dist/axios.min.js"></script> npm: npm install axios 并在全局的js中引入：import axios from 'axios';
•get請求
axios.get('/user?ID=12345')
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
•post請求
依賴于qs包，將對象轉(zhuǎn)換成以&連接的字符串
//例：
axios.post( postUrl ,qs.stringify({userid:1,username:'yyy'})).then(function (response) {
console.log(response);
})
附錄：配置 axios
上面封裝的方法中，使用了 axios 的三個配置項，實際上只有 url 是必須的，完整的 api 可以參考使用說明
為了方便，axios 還為每種方法起了別名，比如上面的 saveForm 方法等價于：
axios.post('/user', context.state.test02)
完整的請求還應(yīng)當包括 .then 和 .catch
.then(function(res){
console.log(res)
})
.catch(function(err){
console.log(err)
})
當請求成功時，會執(zhí)行 .then，否則執(zhí)行 .catch
這兩個回調(diào)函數(shù)都有各自獨立的作用域，如果直接在里面訪問 this，無法訪問到 Vue 實例
這時只要添加一個 .bind(this) 就能解決這個問題
.then(function(res){
console.log(this.data)
}.bind(this))
總結(jié)
以上所述是小編給大家介紹的關(guān)于vue中的ajax請求和axios包問題，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章主要介紹了vuex中store的action和mutations用法，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
最近做的兩個項目都是關(guān)于vue的,做完整理一下,這篇文章主要給大家介紹了關(guān)于如何用vue實現(xiàn)一個有趣的圍繞圓弧動畫效果的相關(guān)資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-04-04
這篇文章主要為大家介紹了解決vue3?defineProps?引入定義的接口報錯詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-05-05
SpringBoot+Vue項目線上買菜系統(tǒng)源碼展示
本線上買菜系統(tǒng)采用的數(shù)據(jù)庫是Mysql，使用springboot框架開發(fā)。在設(shè)計過程中，充分保證了系統(tǒng)代碼的良好可讀性、實用性、易擴展性、通用性、便于后期維護、操作方便以及頁面簡潔等特點,需要的朋友可以參考下2022-08-08
vue+element實現(xiàn)動態(tài)換膚的示例代碼
本文主要介紹了vue+element實現(xiàn)動態(tài)換膚的示例代碼，文中通過示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
這篇文章主要介紹了Vue使用vue-cli創(chuàng)建項目，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
在?Vue.js?開發(fā)中,合理地控制元素的樣式對于構(gòu)建高質(zhì)量的用戶界面至關(guān)重要,Vue?提供了靈活的方式來綁定樣式,這篇文章將探索?Vue?中設(shè)置樣式的七種做法,并結(jié)合代碼,逐步說明每種方法的實現(xiàn),需要的朋友可以參考下2024-03-03
這篇文章主要介紹了計算屬性和偵聽器，文章以介紹計算屬性、偵聽器的相關(guān)資料展開詳細內(nèi)容,需要的朋友可以參考一下，希望對你有所幫助2021-11-11
這篇文章主要介紹了vue2.0移動端滑動事件vue-touch的實例代碼,需要的朋友可以參考下2018-11-11
Vue Router目前最新版本是4.X，本文主要主要介紹了10分鐘快速上手VueRouter4.x教程，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-03-03