Vue 請(qǐng)求傳公共參數(shù)的操作
我就廢話不多說(shuō)了，大家還是直接看代碼吧~
// An highlighted block
//http request攔截器
axios.interceptors.request.use(
config =>{
const token = window.sessionStorage.getItem('Tk_token')
const user_id=window.sessionStorage.getItem('Tk_user_id')
// config.data = JSON.stringify(config.data);
// config.headers = {
// 'Content-Type':'application/x-www-form-urlencoded'
// }
if(token){
config.params = {'token':token,'user_id':user_id}
}
console.log(config);
return config;
},
err =>{
return Promise.reject(err);
}
)
補(bǔ)充知識(shí)：Vue聯(lián)合axios發(fā)送后臺(tái)post請(qǐng)求時(shí)的參數(shù)問(wèn)題
開(kāi)始用的是vue-resource,后來(lái)發(fā)現(xiàn)這個(gè)已經(jīng)很久沒(méi)有更新了，作者已經(jīng)停止更新了，而且就連作者也推薦用axios，那么我就用axios吧，改成axios之后，就出現(xiàn)了一個(gè)問(wèn)題：參數(shù)問(wèn)題。
怎么個(gè)參數(shù)問(wèn)題呢？用vue-response來(lái)發(fā)送post請(qǐng)求的時(shí)候，傳入的參數(shù)到后臺(tái)是一個(gè)一個(gè)分開(kāi)的，比如傳了參數(shù)
{
username:'name1',
password:'pwd1'
}
就是很簡(jiǎn)單的用戶名和密碼，vue-resource傳到后臺(tái)之后，后臺(tái)的接口方法參數(shù)是兩個(gè)，一個(gè)是username，一個(gè)是password，都可以分別取到；但是axios不同，axios到后臺(tái)之后，是一個(gè)map結(jié)構(gòu)的對(duì)象，需要用@RequestBody Map map這種方式來(lái)獲取，然后從map中一個(gè)一個(gè)取出來(lái)，這樣也可以。但是有沒(méi)有辦法讓axios傳給后臺(tái)的參數(shù)也是一個(gè)一個(gè)的呢？當(dāng)然有。
第一個(gè)方法就是URLSearchParams,用這個(gè)添加好參數(shù)，到后臺(tái)就是一個(gè)一個(gè)的，但是這個(gè)IE不支持。
還有一個(gè)辦法，就是qs，qs的話有兩種引入方式，一種就是用npm安裝好后，直接import，然后就可以用了；另一種就是在頁(yè)面直接引入qs.js，就是<script src='js/qs.js'></script>這種方式，然后
注意了！
這里要注意了！
如果是import方式引入的，我們就用qs.stringify調(diào)用就好了，但是！?。?/p>
注意了！
如果是js文件引入的方式，用的Qs，不是qs，Q是大寫(xiě)的Q，也就是Qs.stringify。
然后就可以了！
以上這篇Vue 請(qǐng)求傳公共參數(shù)的操作就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue實(shí)現(xiàn)數(shù)字動(dòng)態(tài)翻牌的效果（開(kāi)箱即用）
這篇文章主要介紹了vue實(shí)現(xiàn)數(shù)字動(dòng)態(tài)翻牌的效果（開(kāi)箱即用）,實(shí)現(xiàn)原理是激將1到9的數(shù)字豎直排版，通過(guò)translate移動(dòng)位置顯示不同數(shù)字，本文通過(guò)實(shí)例代碼講解，需要的朋友可以參考下2019-12-12
Vue開(kāi)發(fā)中出現(xiàn)Loading?Chunk?Failed的問(wèn)題解決
本文主要介紹了Vue開(kāi)發(fā)中出現(xiàn)Loading?Chunk?Failed的問(wèn)題解決，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2022-03-03
vue router動(dòng)態(tài)路由下讓每個(gè)子路由都是獨(dú)立組件的解決方案
這篇文章主要介紹了vue router動(dòng)態(tài)路由下讓每個(gè)子路由都是獨(dú)立組件的解決方案,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2018-04-04
基于Vue實(shí)現(xiàn)文件上傳的幾種實(shí)現(xiàn)方式
文件上傳是web開(kāi)發(fā)中一個(gè)常見(jiàn)的需求,Vue.js作為一款流行的前端框架,也提供了方便的方法來(lái)實(shí)現(xiàn)文件上傳功能,下面這篇文章主要給大家介紹了關(guān)于基于Vue實(shí)現(xiàn)文件上傳的幾種實(shí)現(xiàn)方式,需要的朋友可以參考下2024-03-03
vue 中 get / delete 傳遞數(shù)組參數(shù)方法
這篇文章主要介紹了vue 中 get / delete 傳遞數(shù)組參數(shù)方法,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-03-03
vue.js的computed,filter,get,set的用法及區(qū)別詳解
下面小編就為大家分享一篇vue.js的computed,filter,get,set的用法及區(qū)別詳解，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-03-03
npm?install時(shí)卡住不動(dòng)的五種解決方法
在我們安裝完Node.js之后,需要使用npm命令來(lái)安裝一些工具,下面這篇文章主要給大家介紹了關(guān)于npm?install時(shí)卡住不動(dòng)的五種解決方法,需要的朋友可以參考下2023-06-06
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)圖形驗(yàn)證碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-04-04
這篇文章主要介紹了vue表單驗(yàn)證之禁止input輸入框輸入空格，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12
這篇文章為大家詳細(xì)主要介紹了vue之ele多級(jí)聯(lián)組件的使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-07-07