如何将道具从 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);
    }

}

现在我应该将该用户名作为道具传递给我的仪表板是一个组件

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 与 class 组件一起使用，但您使用的是函数式样式。第二个会话缺少您的用户数据，您必须为用户创建另一个减速器。 Demo

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

how to Pass props from react-redux to container component?

prop

reactjs

redux

react-redux

react-props