类组件:无法读取未定义的属性'user'



我有一个类组件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,
})

最新更新