如何将道具从react redux传递到容器组件

Question

这是我在redux中的代码，一切都很好，代码正在中工作

export const loginUser = (values, history, setFieldError, setSubmitting) => {
i take **email**, split it until @ and take it as a username ,
const username = values.email.split("@")[0]
return () => {
//then i pass it to axios params as a query  name  
axios.get(url, {
params: {
name: username
}
}).then((response) => {
//if res ok
console.log("username", username)
history.push("/user")
}).catch(error => console.error(error))
setSubmitting(false);
}
}

现在我应该把usernam作为道具传递给我的Dashboard，witch是一个组件

const Dashboard = ({logoutUser,user}) => {
const history = useHistory();
return (
<StyledFromArea bg={colors.dark2}>

here i need to show a *username*  
should be like  **Hello , YourName** 
<StyledTitle size={65}>Hello, {user.user}
//but its undefided 
{console.log("user",user.name)}
</StyledTitle>
*same  here*
<ExtraText color={colors.light1}>{user.email}</ExtraText>
{console.log("email",user.email)}
<Userinfo/>
<ButtonGroup>
<StyledButton to="#" onClick={()=> logoutUser(history)}> Logout 
</StyledButton> 
</ButtonGroup>
</StyledFromArea>
)
}
//i use **mapStateToProps**but maybe it's not working ,i think the //problem comes from here
const mapStateToProps =({session})=>({
user:session.user
})
export default connect(mapStateToProps,{logoutUser})(Dashboard) ;

我的代码https://codesandbox.io/s/login-page-forked-6gcvq?file=/src/pages/Dashboard.js

Answer 1

首先，必须将connect与类组件一起使用，但要使用函数样式。如果会话中没有用户数据，则必须为用户创建另一个reducer。演示