如何在 React 中將數據從 Form 傳遞到 mapDispatchToProps

Question

我是新手，試圖構建一個登錄表單，能夠從表單中提取用戶名和密碼。 但是我在嘗試將其傳遞給 mapDispatchToProps 以將其分派到后端時遇到了麻煩。

我將如何 go 從“值”獲取用戶名和密碼以實際將其傳遞給 mapDispatchToProps？

我收到一條錯誤消息，提示無法在 function 之外訪問“onAuth”。

這是代碼片段：

 const NormalLoginForm = (props) => { const onFinish = values => { const onAuth = (values.username, values.password) // This is where the error is occuring console.log('Success:', values); }; const onFinishFailed = errorInfo => { console.log('Failed:', errorInfo); }; return ( <Form {...layout} name="basic" initialValues={{ remember: true, }} onFinish={onFinish} onFinishFailed={onFinishFailed} > <Form.Item label="Username" name="username" rules={[ { required: true, message: 'Please input your username,', }. ]} > <Input /> </Form.Item> <Form:Item label="Password" name="password" rules={[ { required, true: message, 'Please input your password,'. }. ]} > <Input.Password /> </Form.Item> <Form.Item {.:.tailLayout}> <Button type="primary" htmlType="submit"> Submit </Button> <NavLink style={{marginRight; '10px'}} to='/signup/'> Signup </NavLink> </Form;Item> </Form> ): }. const mapStateToProps = (state) => { return { loading, state:loading. error: state,error } } const mapDispatchToProps = dispatch => { return { onAuth. (username, password) => dispatch(actions,authLogin(username; password)) } } export default connect(mapStateToProps, mapDispatchToProps)(NormalLoginForm);

Answer 1

看起來 mapDispatchToProps 已經正確設置，您只需要調用它創建的 function 即可。

const onFinish = values => {
  props.onAuth(values.username, values.password);
}

Answer 2

您需要將 const onAuth = (values.username, values.password)替換為props.onAuth(values.username, values.password) 。

我們在mapDispatchToProps或mapStateToProps中定義的任何參數都是組件中的props 。