react中使用async/await处理异步axios的请求

async/await 是个非常好用的处理的异步的es8新功能。

在react中使用也是特别方便的，如果你是通过create-react-app 创建的项目就不要担心浏览器的支持。直接使用即可。

直接上代码演示，我的axios是经过封装过后Promise。使用原生的也是一样效果，axios原生返回的也是Promise ，所以可以直接 通过let result = awiat Promise 中resolve 和 reject 的结果

requestUserData = async() => {       
        let roleId = this.state.selectedItem.roleId;
        this.params.conditionId = roleId;
        
        let noAuthUserResult = await axios.ajax({
            url: api.sys_auth_user_selectForPageNoAuthUser,
            data: this.params
        })
        let authUserResult = await axios.ajax({
            url: api.sys_auth_user_selectForPageAuthUser,
            data: this.params
        })
        if (!noAuthUserResult.status && !authUserResult.status){
            let targetKeys=[];
            let noAuthUserResultList = noAuthUserResult.data.recordList.map((item) => {
                item.key = item.userId;
                return item;
            });
            let authUserResultList = authUserResult.data.recordList.map((item) => {
                item.key = item.userId;
                targetKeys.push(item.userId);
                return item;
            });

            this.setState({
                leftData: [...noAuthUserResultList, ...authUserResultList],
                targetKeys: targetKeys,
                isVisibleTransfer: true
            })
        }else{
            Modal.info({
                title: "请求数据失败",
                content: ""
            })
        }        
    }