vsCode封装网络请求

1、在src 下创建一个名为http的文件夹

2、在其下创建

api.js

存放网络请求

//封装所有的请求import service from \'./index\'export default {// login({ username, password }) {//     return service.post(\'/login\', { username, password })// },//1、获取首页数据(get)getHomeDate() {return service.get(\'/recommend\')},//2. 搜索(get)getSearchDate({ value }) {return service.post(\'/search\', { value })},}

在

index.js

完成引用

//封装axiosimport axios from \'axios\'//创建一个axios的实例const service = axios.create({//基础路径baseURL: \'/api\',timeout: 10000})//响应拦截service.interceptors.response.use((res) => {return res.data}, err => {console.log(err)})//导出export default service

3、在

App.vue

下的

main.js

下挂载

import api from \'./http/api\'//挂载在原型对象上Vue.prototype.$api = api

4、在组件中引用

this.$api.函数名  完成引用//如下this.$api.getCard().then((res) => {this.list = res.shopList?res.shopList:[];window.console.log(this.list);}).catch((err) => {window.console.log(err);});