vue3一下的axios封裝（介面請求封裝）

1.安裝axios依賴

npm i axios -s

2.建立乙個utils檔案，和乙個api檔案，在前者下面建立乙個request.js的檔案。該檔案中引入axios

import axios from 「axios」;

3.開始操作：

/**

* 封裝axios
*/import axios from
'axios'
//引入axios的第三方外掛程式
import
from
'element-ui'
//按需引入ui外掛程式
import
from
'vue/types/umd'
// 1.建立axios實列
const service = axios.
create()
console.
log(
"11"
, service)
;// 2.用建立的axios例項生成請求***
service.interceptors.request.
use(config =>
else
return config;
}, error =>);
// 3.用建立的axios例項生成響應***
service.interceptors.response.
use(response =>
= response.data;
if(code ==0)
)}else
return response;
}, error =>
)// 匯出兩個請求方法
export
default))
.then
(res =>).
catch
(err =>)}
)},post
(url, params =))
.catch
(err =>)}
)}}

//如果

把req

uest

放在全域性

上，那麼

在vue

元件中就

不用引入

,直接在

函式中用

this

.http.post('url', params) //如果把request放在全域性上，那麼在vue元件中就不用引入,直接在函式中用this.

)//如

果把re

ques

t放在全

局上，那

麼在vu

e元件中

就不用引

入,直接

在函式中

用thi

s.http.post/get(url.params)傳送請求

// eg:// 引入請求函式

// import from 「@/api/account」;//引入請求介面函式

// async getaccounts() = await getaccountlist();

list item

Vue3正確的開啟方式（下）

import from vue const count ref 10 寫法一 預設返回getter函式 返回值為乙個唯讀的ref物件 const doublecount computed count.value 2 因為返回值為ref物件 取值需要拿它的value console.log doubl...

說一下vue2 vue3的區別？

1.建立專案 3.0 vue create 進入工程資料夾，建立專案。2.0 vue init webpack2.啟動專案 3.0啟動npm run serve 2.0啟動npm run dev3.目錄結構 2.x中 移除了配置檔案目錄，config 和 build 資料夾 3.x中 相關的配置需要...

總結一下《vue的使用》

1.用vue建立專案的時候，1.安裝axios，對axios進行處理，建立axios.js檔案，設定基礎請求位址，設定前置守衛和獨享守衛，對請求資料進行設定，特別實在進行token驗證的時候特別需要設定 2.後台伺服器如果跨域，需要在根目錄建立vue.config.js具體參考vue官網的介紹 3....