美文网首页技术贴
mpvue中配置axios使用

mpvue中配置axios使用

作者: zhudying | 来源:发表于2020-03-24 11:00 被阅读0次

    mpvue中使用axios

    1.api的index.js文件下配置axios
    import axios from 'axios';
    /**
     * axios配置
     */
    // axios请求拦截器
    axios.interceptors.request.use(config => {
      //to do something...
      return config;
    }, error => {
      mpvue.showToast({ icon: 'none', title: '网络繁忙,请稍后重试' });
      console.log(error, 'error')
      return Promise.reject(error);
    })
    // axios响应拦截器
    axios.interceptors.response.use(data => {
      //to do something...
      mpvue.hideLoading();
      return data;
    }, error => {
      mpvue.showToast({ icon: 'none', title: '网络繁忙,请稍后重试' });
      console.log(error, 'error2')
      return Promise.reject(error);
    })
    
    //axios自定义请求
    axios.defaults.adapter = function (config) {
      return new Promise((resolve, reject) => {
        mpvue.request({
          url: config.url,
          data: config.params,
          method: config.method,
          header: {
            'Authorization': 'xxx',
            'Content-Type': 'application/json; charset=UTF-8'
          },
          success: (res) => {
            return resolve(res);
          },
          fail: (res) => {
            return reject(res);
          }
        })
      })
    }
    
    /**
     * url:请求地址
     * params:请求参数
     * mthods:请求方法
     * */
    
    export default async (url, params, method) => {
      try {
        const response = await axios(url, { params, method });
        return response;
      } catch (error) {
        throw new Error(error);
      }
    }
    
    2.api下新建page文件封装请求函数
    import axios from './index'
    
    export const getMessage = (params) => axios("http://xxx", params, 'post')
    
    3.在页面引用请求函数
    import { getMessage } from '@/api/page.js'
    async handler () {
          let res = await getMeaasge({})
          console.log(res, 'res')
    }
    

    相关文章

      网友评论

        本文标题:mpvue中配置axios使用

        本文链接:https://www.haomeiwen.com/subject/swxoyhtx.html