如何使用Redux正确管理React中的组件？

这是我的登录页面容器组件：

export class Loginpage extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            toggleSignUp: false,
            displayName: '',
            signUpEmail: '',
            signUpPassword: ''
        };
    }

    //Sign up functions
    handleDisplayNameChange = (e) => {
        const displayName = e.target.value;
        this.setState(() => ({ displayName }));
    }

    handleSignUpEmailChange = (e) => {
        const signUpEmail = e.target.value;
        this.setState(() => ({ signUpEmail }));
    }

    handleSignUpPasswordChange = (e) => {
        const signUpPassword = e.target.value;
        this.setState(() => ({ signUpPassword }));
    }

    startSignUp = () => {
        this.props.startSignUp(this.state.signUpEmail, this.state.signUpPassword);
    }

    render() {
        return (
            <div className="login-container">
                <SignUp
                    toggleSignUp={this.toggleSignUp}
                    displayName={this.state.displayName}
                    signUpEmail={this.state.signUpEmail}
                    signUpPassword={this.state.signUpPassword}
                    handleDisplayNameChange={this.handleDisplayNameChange}
                    handleSignUpEmailChange={this.handleSignUpEmailChange}
                    handleSignUpPasswordChange={this.handleSignUpPasswordChange}
                    startSignUp={this.startSignUp}
                    />
            </div>
        )
    }
}

因为我只希望容器组件与redux状态通信，所以，我决定将值和回调函数传递给SignUp组件，这样SignUp组件将只是无状态组件而不需要connect（）（）到redux .

这是我的SignUp子组件：

const SignUp = (
    {displayName, 
    signUpEmail,
    signUpPassword,
    handleDisplayNameChange,
    handleSignUpEmailChange,
    handleSignUpPasswordChange,
    startSignUp}
    ) => (
    <div>
        <div>
            <label>
                <span>Name</span>
                <input type="text" value={displayName} onChange={handleDisplayNameChange} />
            </label>
            <label>
                <span>Email</span>
                <input type="email" value={signUpEmail} onChange={handleSignUpEmailChange} />
            </label>
            <label >
                <span>Password</span>
                <input type="password" value={signUpPassword} onChange={handleSignUpPasswordChange} />
            </label>
            <button type="button" onClick={startSignUp}>Sign up</button>
        </div>
    </div>
)

代码工作正常，我只是不确定这是否是管理反应组件结构的正确方法？我很怀疑使用props将值和回调函数传递给子组件是一种正确的方法 .