vue使用 axios+promise封装一

在使用vue开发的过程中,我们都会使用vue中axios进行请求,为了简化代码,我下面对其方法进行了封装,希望对你有所帮助,方法如下:

1. 开发环境 vue.js
2. 电脑系统 windows 10 专业版
3. 封装代码如下:
4. 在mounted 中添加如下代码:

// 新的 封装 promise  --重点
      // 优势,可以发送多个后台请求
      var _on=this;
      async function quer(url){

        var inn=await _on.$axios.post('/'+url);
        return inn;
      };

      quer('chen2dpro').then(res => {
        console.log(res);
      });

      quer('chen2d').then(res => {
        console.log(res);
      });

      // 结束啦

1. 在点击事件中,怎么发送请求,在methods中添加如下代码:

methods:{
      // 点击设备一,弹出对应的信息框
      shibei(){
        console.log('100');
        var _on=this;
        async function quer(url){

          var inn=await _on.$axios.post('/'+url);
          return inn;
        };
        quer('chen2d').then(res => {
          console.log(res);
        });
      },
      // 封装 axios请求

    }

本期的教程到了这里就结束啦,是不是很简单!希望对你有所帮助,让我们一起努力走向巅峰!