Javascript TypeError:this.props.dispatch不是一个函数

我想通过单击“登录”或“注册”按钮来显示一个模块化窗口，并得到以下错误类型错误：_this.props.dispatch不是一个函数。一个项目中的相同代码通常适用于另一个项目

import React from "react";
import { Link } from "react-router-dom";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import { openModal } from "../modal/index";
import Login from "../auth/Login";
import Register from "../auth/Register";

class Navbar extends React.Component {
  static propTypes = {
    dispatch: PropTypes.func.isRequired,
  };
  constructor(props) {
    super(props);
    this.login = this.login.bind(this);
    this.register = this.register.bind(this);
   }

  login() {
    this.props.dispatch(
      openModal({content: <Login />,title: "Login"}));
  }
  register() {
    this.props.dispatch(
      openModal({content: <Register />,title: "Register"}));
  }

  render() {
      const guestLinks = (
      <ul className="navbar-nav ml-auto">
        <li className="nav-item">
          <button
            className="m-1 btn-sm btn btn-outline-primary mt-1"
            onClick={this.register}>Register</button>
        </li>
        <li className="nav-item">
          <button
            className="m-1 btn-sm btn btn-outline-primary mt-1"
            onClick={this.login}>Login</button>
        </li>
      </ul>
    );

    return (
      <nav className="navbar navbar-expand-sm navbar-light bg-light mb-4">
        <div className="container">
          <Link className="navbar-brand" to="/">
            Domras
          </Link>
          <button
            className="navbar-toggler"
            type="button"
            data-toggle="collapse"
            data-target="#mobile-nav">
            <span className="navbar-toggler-icon" />
          </button>

          <div className="collapse navbar-collapse" id="mobile-nav">
            <ul className="navbar-nav mr-auto">
              <li className="nav-item">
                <Link className="nav-link" to="/profiles">
                  Driver
                </Link>
              </li>
            </ul>
           </div>
        </div>
      </nav>
    );
  }
}
  const mapStateToProps = state => ({
  auth: state.auth,
});

 export default connect(mapStateToProps)(Navbar);

---

欢迎来到堆栈溢出

如果一切正常，你就不会有问题

错误消息表明dispatch属性不是函数-如果是，您应该在控制台中得到警告

为您保存一些代码的提示。。。使用下面的fat arrow函数，这些函数会自动绑定到此函数，因此您无需在构造函数中绑定它们：

  constructor(props) {
    super(props);
// No longer needed
    // this.login = this.login.bind(this);
    // this.register = this.register.bind(this);
   }

  login = () => {
    this.props.dispatch(
      openModal({content: <Login />,title: "Login"}));
  }
  register = () => {
    this.props.dispatch(
      openModal({content: <Register />,title: "Register"}));
  }

---

您好，您能包括发送代码或调用代码吗？代码正在运行。按下按钮时出错。它没有帮助。还有什么问题？