關(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包問題，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章主要介紹了ElementUI多個子組件表單實現(xiàn)方法,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-11-11
vue中后端做Excel導出功能返回數(shù)據(jù)流前端的處理操作
這篇文章主要介紹了vue中后端做Excel導出功能返回數(shù)據(jù)流前端的處理操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-09-09
這篇文章主要介紹了vue實現(xiàn)局部刷新的實現(xiàn)示例，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-04-04
詳解Vue3?父組件調(diào)用子組件方法($refs?在setup()、＜script?setup＞?中使用)
這篇文章主要介紹了Vue3?父組件調(diào)用子組件方法（$refs?在setup()、＜script?setup＞?中使用）,在 vue2 中 ref 被用來獲取對應(yīng)的子元素，然后調(diào)用子元素內(nèi)部的方法，本文通過實例代碼給大家介紹的非常詳細，需要的朋友可以參考下2022-08-08
vue?watch監(jiān)聽觸發(fā)優(yōu)化搜索框的性能防抖節(jié)流的比較
這篇文章主要為大家介紹了vue?watch監(jiān)聽觸發(fā)優(yōu)化搜索框的性能防抖節(jié)流的比較,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-10-10
這篇文章主要介紹了vue?同局域網(wǎng)訪問不到的問題及解決，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10
vue路由傳參的使用場景一般都是應(yīng)用在父路由跳轉(zhuǎn)到子路由時,攜帶參數(shù)跳轉(zhuǎn),下面這篇文章主要給大家介紹了關(guān)于Vue路由傳參的三種方式,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2023-01-01
最近項目中讓實現(xiàn)一個導入導出Excel的功能,下面這篇文章主要給大家介紹了關(guān)于前端利用vue實現(xiàn)導入和導出功能的相關(guān)資料,文中通過代碼介紹的非常詳細,需要的朋友可以參考下2024-09-09
這篇文章主要為大家介紹了vue中使用axios請求post接口,請求會發(fā)送兩次原因解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-11-11
vue使用vuedraggable實現(xiàn)嵌套多層拖拽排序功能
這篇文章主要為大家詳細介紹了vue使用vuedraggable實現(xiàn)嵌套多層拖拽排序功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-04-04