我有一个类组件User,我想呈现state.user
中的内容。使用Redux开发工具,我可以看到用户拥有正确的值。
这就是我目前所拥有的:
class User extends Component {
componentDidMount() {
this.props.getUser('60ab0b564fbb1d334002c777');
}
renderUser = (user) => {
return (
user !== {} ? <p>{user.name}</p> : 'User not found'
)
}
render() {
console.log('props', this.props);
return (
<div>
{this.renderUser(this.props.users.user)}
</div>
)
}
}
const mapStateToProps = state => ({
user: state.user,
})
export default connect(mapStateToProps, {
getUser,
})(User);
当我在render方法下记录this.props
时,它记录:
getUser: ƒ ()
user: undefined
在我合并减速器的商店里,我有:
const rootReducer = combineReducers({
users: userReducer
});
这就是为什么我需要执行this.props.users.user
来访问用户
用户的初始状态为{}
我认为您在mapStateToProps中做得不对。
在那里做这个
user: state.users
然后在渲染方法
this.props.user.user
您的初始状态应该是
用户的初始状态是{name: ''}
而不是{}
。因为当组件第一次呈现您的功能时,需要访问user.name
你在这里也有打字错误
const mapStateToProps = state => ({
user: state.users,
})