1.在src下新建util文件夹，在util下新建request.js文件：

封装axios：

import axios from 'axios'import QS from 'qs';// import store from '@/store/index.js';import { Message } from 'element-ui';  //element库的消息提示，可以不用// 环境的切换// if (process.env.NODE_ENV == 'development') { //开发//     axios.defaults.baseURL = '/api';}// else if (process.env.NODE_ENV == 'debug') { //测试//     axios.defaults.baseURL = 'https://www.ceshi.com';// }// else if (process.env.NODE_ENV == 'production') { //线上//     axios.defaults.baseURL = 'https://www.production.com';// }// 请求超时时间axios.defaults.timeout = 15000;// post请求头axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';// 请求拦截器axios.interceptors.request.use(    config => {        // 每次发送请求之前判断是否存在token，如果存在，则统一在http请求的header都加上token，不用每次请求都手动添加了        const token = '45f8f587-7b46-462f-a8c4-1ca4dc64a336';        if (token) {  // 判断是否存在token，如果存在的话，则每个http header都加上token            config.headers.Token = token;        }        return config;    },    error => {        return Promise.error(error);    });// 响应拦截器axios.interceptors.response.use(    response => {        if (response.status === 200) {            return Promise.resolve(response);        } else {            return Promise.reject(response);        }    },    // 服务器状态码不是200的情况    error => {        if (error.response.status) {            console.log(error)        }        return Promise.reject(error.response);    });export function get(url, params) {    return new Promise((resolve, reject) => {        axios.get(url,            {                params: params            })            .then(res => {                resolve(res.data);            })            .catch(err => {                if (!err.response) {                    Message({                        showClose: true,                        message: 'get请求错误',                        type: 'error'                    });                } else {                    reject(err.data);                    console.log(err.response, '异常2');                }            })    });}export function post(url, params) {    return new Promise((resolve, reject) => {        axios.post(url, params)            .then(res => {                resolve(res.data);            })            .catch(err => {                if (!err.response) {                    Message({                        showClose: true,                        message: 'post请求错误',                        type: 'error'                    });                } else {                    reject(err.data);                    console.log(err.response, '异常2');                }            })    });}export default axios

2：在util文件下再新建api.js文件：

import { get, post } from './request'export function getTest(params) {    return post(`/api/tbk/dg_optimus_material`, params);}export function getNvZhuang(params) {    return post(`/api/tbk/dg_material_optional `, params);}

3:在html页面访问接口：

import { getTest, getNvZhuang } from "@/util/api.js"; // 导入api接口  mounted: function() {    this.queryList();  },  methods: {    //精选    queryList() {      let params = { pageNo: 1, pageSize: 20 };      getTest(params)        .then(res => {          this.jingxuanlist =            res.tbk_dg_optimus_material_response.result_list.map_data;          console.log(this.jingxuanlist);        })        .catch(error => {          console.log(error);        });    }}