定时器妙用-把顺序加载大量ajax调用

在项目中根据第一个接口获得的uid去循环请求不同参数传入的第二个url

然后把结果插入第一个接口的数据内,这样做的话有时候会不按顺序加载,这时候只要设置定时器(为0也可)即可

    fngetdate(){//点击确定获取请求
    let url = this.baseurl+ 'jk_PLM/get_bom_list.php'
        this.$http.get(url).then((res)=>{
            console.log(res)
            if(!res) return
            this.data =[]
            res.data.map((v,i)=>{
                this.data.push({
                    number:i+1,
                    key: i*v[0],
                    producType:'二级管类',
                    id:v[2]+v[0],
                    yongliang:v[1],
                    tags: [],
                })
            })
            this.fngetDetail()
            console.log(this.data)
        })
    },
    fngetDetail(){
        var url = null
        this.data.map((v,i)=>{
            console.log(v.tags)
             url =this.baseurl+ 'jk_PLM/get_drow_and_doc.php?pid='+v.key
             // console.log(url)
            setTimeout(()=>{//设置定时器会顺序加载
                 this.$http.get(url).then((res)=>{
                     console.log(res.data)
                                 this.data[i].tags = res.data
                                 // res.data.map((value,ind)=>{
                                 //     // value.filename,value.file_url
                                 //     v.tags.push({
                                 //         filename:value.filename,
                                 //         file_url:value.file_url
                                 //     })
                                 // })
                 })
             },0)
        })
    }
    <a-row :gutter="20" type="flex" justify="start">
      <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" style="margin-bottom:20px;">
        <a-card title="" hoverable
        :headStyle="cardHeaderStyle"
        style="width:100%;text-align:center;">
         <a-table :columns="columns" :data-source="data" bordered size="middle" :pagination="pagination">
             <!-- 插槽 -->
               <span slot="tags" slot-scope="tags">
                     <a-spin v-if="tags.length <= 0"/>
                  <p v-for="tag in tags">
                       <a :href="tag.file_url"  title="点击下载图标料号">{{tag.filename}}</a>
                  </p>
               </span>
               <!-- 内部表 -->
              <!--  <div slot="expandedRowRender" slot-scope="record" style="margin: 0">
                    1231 {{record}}
                </div> -->
         </a-table>
      </a-card>
      </a-col>
    </a-row>    

posted @ 2020-07-03 13:58  少哨兵  阅读(310)  评论(0编辑  收藏  举报