关于vue.js:vue中axiospromise封装二

39次阅读

共计 836 个字符，预计需要花费 3 分钟才能阅读完成。

在开发的过程中, 咱们常常会应用到 vue 进行开发, 在应用的过程中, 咱们会进行数据的交互, 以下是我对 axios+promise 的封装二, 办法如下:

开发环境 vue.js
电脑系统 windows10 专业版
vue+axios+promise 封装二, 代码如下:
在 methods 中增加代码如下:

methods:{
      // 点击设备, 发送申请
      shibei(){this.chenq('chen2d');
        // 增加一个定时器, 这个定时器只会执行一次, 作用是获取到批改过后的数据, 因为这个办法是异步的, 如果不增加这个定时器是无奈获取到数据的
        setTimeout(function(){// console.log();
          // 对 return 上面定义的变量从新赋值, 这样的话就能够在点击事件中进行数据的操作
          // 解释阐明, chenax 是在 return 上面对定义的变量 chenax:'0'
          var cccc=_on.chenax;
          console.log(cccc);
        },200)

      },
      // 封装 axios 申请, 通过传参的办法
      chenq(url){
        var _on=this;
        async function quer(url){var inn=await _on.$axios.post('/'+url);
          return inn;
        };
        quer(url).then(res => {console.log(res);
          // 在申请胜利的时候, 对 return 上面的变量 chenax 从新赋值
           _on.chenax=res;
          console.log(_on.chenax);
        });
        
        // 在调用这个办法的时候, 把这个被赋值之后的变量返回进来, 这个就能够失去来自后盾的数据, 增加定时器的起因是这个办法是异步的, 如果不增加定时器, 失去的值始终是 在 return 上面刚刚定义的初始值
        setTimeout(function(){return _on.chenax},100)
      }
    }

正文完