vue对axios的封装使用

对于Vue对axios的封装使用，通常可以按照以下步骤进行：

首先，在项目中安装axios和vue-axios插件。可以通过以下命令来安装：npm install axios vue-axios
登录后复制

在main.js文件中引入axios和vue-axios，并将其配置为Vue的全局属性：

import axios from 'axios';
import VueAxios from 'vue-axios';

Vue.use(VueAxios, axios);
3. 创建一个api.js或者request.js文件，用来封装axios的一些请求方法。这个文件中可以定义一些通用的请求拦截器和响应拦截器，以及一些常用的请求方法。例如：

import axios from 'axios';

// 请求拦截器
axios.interceptors.request.use(config => {
// 在发送请求之前做些什么，比如添加token到请求头部
return config;
}, error => {
// 对请求错误做些什么
return Promise.reject(error);
});

// 响应拦截器
axios.interceptors.response.use(response => {
// 对响应数据做些什么
return response.data;
}, error => {
// 对响应错误做些什么
return Promise.reject(error);
});

// 封装GET请求方法
export function get(url, params) {
return axios.get(url, { params });
}

// 封装POST请求方法
export function post(url, data) {
return axios.post(url, data);
}
登录后复制

在组件中使用封装好的请求方法。例如，在某个组件的方法中使用GET请求：

import { get } from '@/api';

export default {
  methods: {
    fetchData() {
      get('/api/data').then(response => {
        // 处理接口返回的数据
      }).catch(error => {
        // 处理接口请求失败
      });
    }
  }
}

通过以上步骤，你可以在Vue项目中对axios进行封装和使用，以便于统一管理和处理接口请求。当然，具体的封装方式可以根据项目需求进行调整和扩展。