React Native中response.data正常但解构出的user为undefined问题求助
问题原因
你遇到的undefined问题核心是对象解构的字段名和接口返回的字段名不匹配:
你代码里写的是const { user } = response.data,但从打印的response.data可以看到,接口返回的根字段是project,不存在名为user的字段,解构出来的user自然是undefined。
另外代码里还有两处隐藏问题:
- catch块中直接打印
errorMessage,这个变量是挂载在state上的属性,没有在catch作用域内声明,直接调用会抛出引用错误 - state中
user的初始值为数组,但接口返回的是对象,类型不匹配可能导致后续渲染逻辑报错
解决方案
- 调整解构语句,将返回的
project字段赋值给user变量:
把原来的const { user } = response.data改成const { project: user } = response.data即可 - 修正catch块的打印逻辑:
把console.log(errorMessage)改成console.log(response.data?.error)或者console.log(this.state.errorMessage) - 建议修正state的初始值匹配返回类型:
把state里的user: []改成user: null或者user: {}
修正后的完整currentUser代码
currentUser = async() =>{ try{ const usu = JSON.parse(await AsyncStorage.getItem('@backend:user')) const userID = usu._id const response = await api.get(`/auth/` + userID.toString()) // 解构时重命名字段 const { project: user } = response.data this.setState({ user }) console.log({user}) console.log(response.data) console.log(userID) }catch(response){ const errMsg = response.data?.error || '未知错误' this.setState({ errorMessage: errMsg }) console.log(errMsg) } }
内容的提问来源于stack exchange,提问作者Paulo Avila
相关产品推荐
相关产品推荐

