服务器axios响应慢,axios异步请求一次踩坑

在React应用中,由于axios的异步特性,导致在组件挂载后请求数据的顺序错误,使得state更新不及时,造成显示的用户信息为undefined。通过调整请求处理顺序,在axios的then块中更新state,确保获取的数据是最新的,从而解决了问题。
摘要由CSDN通过智能技术生成

背景

一次在用react写用户修改时,想着将用户基础信息和用户所属角色存储在state中,然后显示。部分代码如下,结果发现运行出来的结果和预料的不一致。这个是为什么呢??真的是纠结了半个下午。

class UserEdit {

this.state = {

initialValue : {

roleIds : []

}

}

componentDidMount() {

this.treeSelectRoles();

this.showUser(1);

this.userRolesId(1);

}

userRolesId = (id) => {

const _this = this;

const initalValue = _this.state.initialValue;

axios.patch('/backstage/users/'+id+'/roleIds')

.then(function (res) {

console.log(res.data); //[12,13]

_this.setState({

initialValue:{

...initalValue,

roleIds : res.data

}

})

})

.catch(function (err) {

message.error(err.response

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值