使用axios.all和axios.spread处理并发请求

点击机构树查询人员信息和行政区域数据,但他们是两个接口。

template结构

        <div class="organize-view">
            <el-tree
                :data="treeData"
                :props="defaultProps"
                ref="tree"
                :show-checkbox="false"
                :load="loadSubOrg"
                lazy
                @node-click="getData"
                :expand-on-click-node='false'
                :default-expand-all='false'>
                    <span class="custom-tree-node" slot-scope="{ node}">
                        <span class="tree-node_left">{{node.label}}</span>
                    </span>
            </el-tree>
        </div>

  

        //点击机构获取某机构人员数据
        getData(node) {
            // let orgId = node.id;
            let that = this;
            this.paulId = node.id;
            this.$axios.all([ that.getHaveUser(), that.getDistrict()])
                .then(that.$axios.spread((resUser, resDist) => {
                    console.log(resUser.users, '人员')
                    this.tableData = resUser.users;
                    console.log(resDist.district, '行政区域')
                }))
        },
        getHaveUser() {
            return this.$axios({
                    method: 'post',
                    url: this.$api.personManage.findUsersHaveResources,
                    data: { "orgId" : this.paulId}
                })
        },
        getDistrict() {
            return this.$axios({
                    method: 'get',
                    url: this.$api.organization.findByOrgId + '/' + this.paulId,
                })
        },

  使用axios.all和axios.spread处理并发请求