Javascript 无法显示更新的状态(REACT-NATIVE)
我想在我的应用程序的侧抽屉中显示更新后的状态名称,我的功能工作正常,因为我可以在控制台中看到两次打印的名称,但由于某些原因,我无法在应用程序屏幕上显示名称值(显示起始值“”),我想我可能使用了错误的生命周期方法。有人能帮我吗Javascript 无法显示更新的状态(REACT-NATIVE),javascript,reactjs,react-native,Javascript,Reactjs,React Native,我想在我的应用程序的侧抽屉中显示更新后的状态名称,我的功能工作正常,因为我可以在控制台中看到两次打印的名称,但由于某些原因,我无法在应用程序屏幕上显示名称值(显示起始值“”),我想我可能使用了错误的生命周期方法。有人能帮我吗 state = { name: { value: "" } componentWillMount() { getTokens((value) => { if (value[0][1] === null) {
state = {
name: {
value: ""
}
componentWillMount() {
getTokens((value) => {
if (value[0][1] === null) {
alert('whoops')
} else {
this.props.UpdateUserData(value[0][1]).then(()=>{
console.log(this.props.User.userData)
this.state.name.value = this.props.User.userData
console.log(this.state.name.value)
})
}
})
}
render() {
return (
<View style={styles.container}>
<Text style={styles.displayname}>{this.state.name.value}
</Text>
</View>
)
}
状态={
姓名:{
值:“”
}
组件willmount(){
getTokens((值)=>{
if(值[0][1]==null){
警报(‘呜呼’)
}否则{
this.props.UpdateUserData(值[0][1])。然后(()=>{
log(this.props.User.userData)
this.state.name.value=this.props.User.userData
console.log(this.state.name.value)
})
}
})
}
render(){
返回(
{this.state.name.value}
)
}
引用自
避免componentWillMount()中的异步初始化
componentWillMount()在装入之前立即调用。它
在render()之前调用,因此此方法中的设置状态将
不触发重新渲染。避免引入任何副作用或
此方法中的订阅
用
componentDidMount
替换componentWillMount
。应能正常工作this.state.name.value=this.props.User.userData
不要直接改变您的状态,因为它不会重新启动组件,而是使用下面的setState
方法
this.setState({
名称:this.props.User.userData
});
您正在使用的this.state.name.value
不正确。它设置状态,但实际上不会导致组件重新呈现自身。相反,您需要使用setState方法更改状态值。这将在状态更改后调用以重新呈现组件。
这种方法的例子是
this.setState({
名称:this.propo.User.userData
});
虽然这种方法可行,但不建议改变state的值。根据指南,状态需要被认为是不可变的。componentWillMount与构造函数没有太大区别-它也只在初始安装生命周期中被调用一次。许多人会尝试使用此函数来发送请求获取数据并期望数据在初始渲染准备就绪之前可用。情况并非如此 — 虽然请求将在渲染之前初始化,但在调用渲染之前无法完成
this.setState可以解决这种情况下的问题。您必须使用this.setState();更新组件状态并强制重新请求。对于长时间运行和网络调用,不要使用componentWillMount。请改用componentDidMount。使用Promises/thunks。同时检查箭头函数:通常的语法如下:nameOfFunction=(paramOne,paramtoo)=>{….}您正在直接更改状态。始终使用setState方法修改状态值。
componentWillMount
已被弃用。始终使用componentDidMount
。componentDidMount没有任何区别,它仍然没有显示任何内容,使用此方法设置状态。setState解决了我的问题problem@sod.heretic:请务必将其标记为答案,以供参考其他面临类似问题的人。谢谢