【问题标题】:React-Redux action dispatch Issue?React-Redux 动作分派问题?
【发布时间】:2017-11-11 08:54:06
【问题描述】:

这是下面的代码,我无法调用 userLoginRequest。 userLoginRequest 只是对用户进行身份验证,我无法为 userLoginRequest 发送操作。我是 react 和 react-redux 的新手,所以请指导我。

import React, { PropTypes } from 'react';
import { connect } from 'react-redux';
import Helmet from 'react-helmet';
import { createStructuredSelector } from 'reselect';
import makeSelectLoginContainer from './selectors';
import Login from 'components/Login';
import { userLoginRequest } from './actions';


export class LoginContainer extends React.PureComponent { // eslint-disable-line react/prefer-stateless-function
  doLogin(username, password) {
    console.log('DoLogin', username, password);
  }
  render() {
    return (
      <div>
        <Login handleSubmit={this.doLogin}></Login>
      </div>
    );
  }
}

LoginContainer.propTypes = {
  userLoginRequest: PropTypes.func.isRequired,
};

const mapStateToProps = createStructuredSelector({
  LoginContainer: makeSelectLoginContainer(),
});


function mapDispatchToProps(dispatch) {
  return {
    userLoginRequest: (username, password) => dispatch(actions.userLoginRequest(username, password)),
  };
}

export default connect(mapStateToProps, mapDispatchToProps)(LoginContainer);

【问题讨论】:

  • 我看到你调用了错误的登录请求函数handleSubmit={this.props.userLoginRequest},请确保登录组件传递用户名,密码作为参数

标签: reactjs redux react-redux redux-saga


【解决方案1】:

你已经解构了你的动作模块

userLoginRequest: (username, password) => dispatch(userLoginRequest(username, password)),

或不破坏动作

import * as actions from './actions';

当然你需要在doLogin 方法中调用this.props.userLoginRequest :)

【讨论】:

  • 谢谢。这解决了我的问题。你能建议我一些网站来了解我关于 react 和 redux 的基础知识吗
  • 没问题。 Redux 的文档实际上很好 redux.js.org 但这个问题更多的是关于 esWhaterever 基础知识。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2019-03-19
  • 2017-06-18
  • 2017-10-15
  • 2021-06-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多