• vue中的axios与promise (解决 两个或者多个接口 数据依赖的问题)
      var bookList_;   //所有书籍
      var ByBookList_ ; //用户买过的所有书籍
      // new Promise  ES6 的新语法
      var promise = new Promise((resolve, reject) => {  
        this.apis.adminApi
          .bookList({ thisPage, totalPagesDate })
          .then((res) => {
            resolve(res)
            var data = res.data
            var bookList = data.objList //数据集合
            this.totalData = data.totalData //总页数
            this.thisPage = data.thisPage //当前页
            // localStorage.setItem('bookList_', JSON.stringify(data.objList))
            bookList_ = data.objList
          })
      })
	//只有上一个 接口调用成并且返回数据以后才能调取下面这个方法
      promise.then((res) => {
       console.log(bookList_)
      
        //获取个人买过的所有书籍
        this.apis.adminApi.selectUserBook(username).then((res) => {
          var data = res.data
          if (data.code == 200) {
            this.ByBookList = data.backups2
            ByBookList_ = data.backups2
          }
        })
      })
  • 可以同时调用两个或者 多个接口 对他们返回的数据数据进行二次加工
 /**
         * 所有的书
         */
        var _this = this
        function bookList_(){
                return   _this.apis.adminApi.bookList({ thisPage, totalPagesDate })
        }
        /**
         * 用户买的所有书
         */
        function ByBookList_(){
                //获取 登录的这个人的id  存储在了 vuex 中
                var username = _this.$store.state.user.userInfo.id
                return   _this.apis.adminApi.selectUserBook(username)
        }
        axios.all([bookList_(),ByBookList_()])
        .then(axios.spread((res1, res2)=>{
            console.log(res1,res2)
        }))

新增加的简单使用方式,

       const p = Promise.all([ myajaxWtt(`company/api/companyLogin`,'post',data), myajaxWtt('company/api/randomImage/'+this.key,'get')]);
                        p.then(res => {
                            console.log("2个异步请求都执行完成",res);
                        })
//myajaxWtt 是我封装的ajax 请求
 // 自己封装ajax  axios也是这样这样的
 function myajaxWtt(url,type,data){
  return 	$.ajax({     
          url:commomUrl+url, 
          contentType: 'application/json;charset=UTF-8',
          dataType:"json",  
          type:type, 
         // headers:{token:token},
         // async:asyncs,
          data:JSON.stringify(data),
       });
}

在这里插入图片描述

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐