反应原生componetWillUpdate不工作
问题描述:
我想呈现一个组件已经存在的数据从状态(从redux持久提供),数据在state.login.user(我可以看到它在console.log中的mapStateToProps正在被调用,并返回的dataObject功能:state.login.user但dataObject时没有被更新,因为componentWillReceiveProps的不被称为反应原生componetWillUpdate不工作
你可以点我什么即时做错了
import React from 'react'
import { connect } from 'react-redux'
import { ScrollView, AppRegistry, Component, Text, Image, View, Button, Modal, TouchableOpacity } from 'react-native'
import { GiftedForm, GiftedFormManager } from 'react-native-gifted-form'
// Styles
import styles from './Styles/MyProfileScreenStyles'
class MyProfileScreen extends React.Component {
constructor (props, context) {
const dataObject = {
profile: {
last_name : undefined,
}
}
super(props, context)
this.state = {
form: {
lastName: dataObject.profile.last_name,
tos: false
}
}
}
handleValueChange (values) {
this.setState({form: values})
}
componentWillReceiveProps (newProps) {
console.tron.log("componend will receive")
console.tron.log(newProps)
if (newProps.dataObject) {
this.setState({
dataObject: newProps.dataObject
})
}
}
render() {
const {lastName, tos, gender} = this.state.form
console.log('render', this.state.form)
return (
<View style={styles.container}>
<GiftedForm
formName='signupForm'
openModal={(route) => { this.props.navigator.push(route) }}
onValueChange={this.handleValueChange.bind(this)}
>
<GiftedForm.TextInputWidget
name='lastName'
title='Last name'
placeholder='Last name'
clearButtonMode='while-editing'
value={lastName}
/>
<GiftedForm.HiddenWidget name='tos' value={tos}/>
</GiftedForm>
</View>
)
}
}
const mapStateToProps = (state) => {
if(state.login.user !== null){
console.tron.log("test map state to props")
return {
dataObject: state.login.user
}
}
return {}
}
export default connect(mapStateToProps)(MyProfileScreen)
?
答
componentWillReceiveProps
仅在组件已渲染后更新道具时调用, nt被重新渲染。您需要在构造函数中设置状态,因为道具应该已经在那里。
你如何设置道具到state.login.user? – AleXzpm
在你的构造函数中,你应该只使用'props.dataObject'来定义'dataObject'。 – Jwebbed
在this.state中放入'dataObject:props.dataObject' –