vue配置项目的公共请求域名

雪天web

共 613字,需浏览 2分钟

 ·

2021-06-02 00:37

1. 项目中安装axios请求库npm i axios 

2. 在项目目录下新建一个request.js的文件,在里面写:先导入axios库 
import axios from ‘axios’
然后配置公共域名axios.defaults.baseURL = '你的请求域名'

db1f017e618eb431f37e6f335cdc5847.webp
3. 在main.js里面导入axios库import axios from ‘axios’然后再main.js里面导入新建的这个request.jsimport '../request.js'

4. 把axios挂载到Vue的原型对象上,重命名为$http
Vue.prototype.$http = axios

68330bf97d383cbde915f54a808a5acc.webp
5. 配置响应拦截器(在数据返回来时对数据做的处理),在刚新建的request.js里面写:例如: 去掉axios的包装的一层对象 直接返回需要的数据axios.interceptors.response.use( function( res ) {    return res.data  //直接返回需要的数据
} )

9c8401a5782e5a180bc18dd91c2ec263.webp
6. 到此,就可以在其他的任意页面发axios请求,现在只需要写接口的名称即可,因为公共域名已经配置好了getlist() {    this.$http.get( '/list' ).then( (res)=> {     console.log( res )    //这个数据直接就是需要的数据  } ) 
}

0bbd37c8fb2d2465965d86534b73826e.webp

浏览 69
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

分享
举报