2021-11-07 js自定义串行请求 vue

<template>
  <div>
    <button @click="test">Test()</button>
  </div>
</template>

<script>
export default {
  name: "Test02",
  methods: {
    test() {
      let requestFunctions = [this.packing(this.request01, false, true, '555555'), this.packing(this.request02, ({object:{data:{name}}})=>name, false,'5555'), this.packing(this.request03), this.request04]
      this.requestAll(requestFunctions).execute(8888)
      // this.requestAll(this.request01, this.request02, this.request03, this.request04).execute(66666)
    },
    //包装数据
    packing(requestFun, mapChange, skipError=false, successCode = '000000') {
      if (mapChange === true) mapChange = ({object:{data}}) => data
      return {requestFun, mapChange, skipError, successCode}
    },

    // requestAll(...funcArr) {
    //   // let funcList = funcArr.reduce((item,item2)=>item.concat(item2),[])
    //   funcArr.flat().reverse().forEach(func=>{
    //     let e = this.requestAll.execute
    //     this.requestAll.execute = (data,stop) => func(data, e)
    //   })
    //   return this.requestAll
    // },

    requestAll(...funcArr) {
      // let w= (data)=>this.request01(data, (data)=>this.request02(data,(data)=>this.request03(data,(data)=>this.request04(data))))
      let arr = funcArr.reduce((item, item2) => item.concat(item2), []).reverse()
      this.requestAll.execute =arr.reduce((func1, func2,index) =>
        (data, success = true) => {
          func1.successCode = func2.successCode || '000000'
          if (success || (arr[index+1] && arr[index+1].skipError)) {
            if (typeof func2 === "function") {
              func2(data, func1)
            } else if (func2 instanceof Object) {
              if (typeof func2.mapChange === 'function') {
                func2.requestFun(func2.mapChange(data), func1)
              } else {
                func2.requestFun(data, func1)
              }
            } else {
              throw new Error('类型错误')
            }
          }
        }
      )
      return this.requestAll
    },


    // requestAll(...funcArr) {
    //   this.requestAll.execute = funcArr.reduce((item, item2) => item.concat(item2), []).reverse().reduce((func1, func2) => data => func2(data, func1))
    //   return this.requestAll
    // },


    request01(data, next) {
      alert('request01--->' + JSON.stringify(data))
      let url = 'https://wwww.baidu.com'
      let params = {
        name: 'request01',
        data
      }
      this.requestData(url, params, next)
    },
    request02(data, next) {
      alert('request02--->' + JSON.stringify(data))
      let url = 'https://wwww.yohu.com'
      let params = {
        name: 'request02',
        data
      }
      this.requestData(url, params, next)
    },
    request03(data, next) {
      alert('request03--->' + JSON.stringify(data))
      let url = 'https://wwww.baidu.com'
      let params = {
        name: 'request03',
        data
      }
      this.requestData(url, params, next)
    },
    request04(data, next) {
      alert('request04--->' + JSON.stringify(data))
      let url = 'https://wwww.sougou.com'
      let params = {
        name: 'request04',
        data
      }
      this.requestData(url, params, next)
    },
    requestData(url, data, success, fail) {

      setTimeout(() => {
        try {
          let successData = {
            code: '000000',
            object: {
              data: {
                name: '张三',
                age: '15'
              }
            }
          }
          success && success(successData,successData.code===success.successCode)
        } catch (e) {
          alert('cuowu--' + JSON.stringify(e))
        }
      }, 0)
    }
  }
}
</script>

<style scoped>

</style>

标签：11,func2,requestAll,vue,name,自定义,url,let,data
来源： https://blog.csdn.net/qq_15038747/article/details/121197422