使用有效负载创建动作

Question

我正在编写一个带有redux和redux-actions的ReactJS应用程序。我想创建一个redux-action，其登录详细信息为有效负载，如下所示：{   type: 'AUTH_REQUEST',   payload: { login: 'Foo', password: 'bar' },}...但是我所有的尝试都没有成功。根据文档，应该有一种在有效负载中添加数据的方法，但是我对前端堆栈的了解还不足以真正理解。这是我到目前为止的内容：action.jsimport { createAction } from 'redux-actions';export const AUTH_REQUEST = 'AUTH_REQUEST'export const authRequest = createAction(AUTH_REQUEST);loginFormContainer.jsconst mapStateToProps = state => ({    isLoggedIn: state.authentication.isLoggedIn})const mapDispatchToProps = dispatch => ({    authRequest: () => dispatch(authRequest())})export const LoginFormContainer = connect(    mapStateToProps,    mapDispatchToProps)(LoginForm)loginForm.js  constructor(props) {    super(props);    this.state = {      email: '',      password: '',      errors: {email: '', password: ''},      emailValid: false,      passwordValid: false,      formValid: false    };    this.handleEmailChange = this.handleEmailChange.bind(this);    this.handlePasswordChange = this.handlePasswordChange.bind(this);    this.handleSubmit = this.handleSubmit.bind(this);  } handleSubmit(event) {    event.preventDefault();    this.props.authRequest();  }我相信我应该能够在处理提交时提供以loginForm状态存储的电子邮件和密码，但是我不知道该怎么做...（是的，我是js的新手）。有人可以帮我吗？

Answer 1

action.js

const authRequest = createAction(AUTH_REQUEST, (login, password) => ({ login, password }));

loginFormContainer.js

const mapDispatchToProps = dispatch => ({

    authRequest: (...args) => dispatch(authRequest(...args))

})

loginForm.js

handleSubmit(event) {

    event.preventDefault();

    const { email, password } = this.state;

    this.props.authRequest(email, password);

}