axios封装方式

1、封装axios方式一

首先安装axios

npm install axios

其次编写request.js

import axios from 'axios'
//创建axios实例
const service = axios.create({
  baseURL: 'http://192.168.70.130:7300/mock/5eecd9d60841b906a35efe0d/tensquare',
  timeout: 30000 //请求超时时间
});
export default service;

再其次引入request编写api

gathering.js

import request from '@/utils/request'

const api_name = 'gathering';

//调用接口查询活动列表
export default {
    list() {
        return request({
            url: `/api/${api_name}`,
            method: 'get'
        })
    },
    search(page, size, searchMap) {
        return request({
            url: `/${api_name}/search/${page}/${size}`,
            method: 'post',
            data: searchMap
        })
    },
    findById(id) {
        return request({
            url: `/${api_name}/${id}`,
            method: 'get'
        })
    }

}

最api的调用

import gatheringApi from "~/api/gathering";
export default {
  data() {
    return {
      pageNo: 1,
    };
  },
  asyncData() {
    return gatheringApi.search(1, 12, {}).then((res) => {
      return { items: res.data.data.rows };
    });
  },
  methods: {
    loadMore() {
      gatheringApi.search(this.pageNo++, 12, {}).then((res) => {
        this.items = this.items.concat(res.data.data.rows);
      });
    },
  },
};

本文地址：https://blog.csdn.net/qq_26786441/article/details/108691872