Javascript React Redux:this.props.AppendCharacter不是函数

我搜索了这个问题的答案，但没有找到任何与我的问题相匹配的答案。我正在尝试使用React&Redux构建一个计算器应用程序，每当我单击其中一个数字按钮时，就会出现一个错误，上面写着“this.props.AppendCharacter不是函数”

这是我的相关代码：

number_button.js

import React, {Component} from 'react';
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';

import AnswerScreen from '../containers/answer_screen';
import AppendCharacter from '../actions/index';

class NumberButton extends Component {
    constructor(props) {
        super(props);

        this.state = { button: '' };
        this.clickButton = this.clickButton.bind(this);
    };

    clickButton() {
        this.props.AppendCharacter(this.props.number);
        console.log('clicked on ', this.props.number);
        this.setState({ button: this.props.number });
    }

    render(props) {
        return (
            <div className="number-button general-button" onClick={this.clickButton}>
            {this.props.number}
            </div>
        );
    };
};

function mapDispatchToProps(dispatch) {
    return bindActionCreators({ AppendCharacter }, dispatch);
};

export default connect(null, mapDispatchToProps)(NumberButton);

---

通过将

mapDispatchToProps

更改为：

function mapDispatchToProps(dispatch) {
    return {
        AppendCharacter: (character) => dispatch(AppendCharacter(character));
    };
}

我不熟悉

bindActionCreators

，因此如果您需要该功能，可能需要其他人参与进来

---

---

旁注：在当前设置中，似乎不需要

按钮的组件状态。您可能对此有计划，但在您的示例中未使用。
您可以通过将
mapDispatchToProps
更改为：

function mapDispatchToProps(dispatch) {
    return {
        AppendCharacter: (character) => dispatch(AppendCharacter(character));
    };
}

const mapDispatchToProps = {
  AnswerScreen,
  AppendCharacter 
};

export default connect(null, mapDispatchToProps)(NumberButton);

我不熟悉
bindActionCreators
，因此如果您需要该功能，可能需要其他人参与进来


旁注：在当前设置中，似乎不需要
按钮的组件状态。您可能对此有计划，但在您的示例中未使用。
嗯，我发现了错误。另一个网站上的人帮了我。BindActionCreator工作正常，但问题是当我从../actions/index导入AppendCharacter时，我需要将AppendCharacter用大括号括起来。我改变了这一点，现在这个应用程序开始工作了

const mapDispatchToProps = {
  AnswerScreen,
  AppendCharacter 
};

export default connect(null, mapDispatchToProps)(NumberButton);

唷

谢谢大家的回复。这几天我学到了很多
 嗯，我发现了错误。另一个网站上的人帮了我。BindActionCreator工作正常，但问题是当我从../actions/index导入AppendCharacter时，我需要将AppendCharacter用大括号括起来。我改变了这一点，现在这个应用程序开始工作了

唷

谢谢大家的回复。这几天我学到了很多
 多谢各位。我尝试了你的代码，但不幸的是，它仍然不起作用。这是朝着正确方向迈出的一步，但它不会起作用，因为它实际上没有将分派映射到道具
mapDispatchToProps
需要获取一个参数
dispatch
并返回为每个操作创建者调用
dispatch
的函数。请参阅我的答案，了解设置此选项的一种方法的示例。谢谢。我尝试了你的代码，但不幸的是，它仍然不起作用。这是朝着正确方向迈出的一步，但它不会起作用，因为它实际上没有将分派映射到道具
mapDispatchToProps
需要获取一个参数
dispatch
并返回为每个操作创建者调用
dispatch
的函数。请参阅我的答案，了解设置此选项的一种方法的示例。谢谢。我试过了，但是我得到了一个不同的错误，它说“uncaughttypeerror:（0，_index2.default）不是函数”（哦，我可能会在工作完成后删除组件状态——我在添加了该部分后更改了设计。谢谢你的评论。）很接近了。听起来这解决了你的问题。现在，您需要重新了解导入和导出的方式。听起来您可能有（或没有）一个
默认值
导出，而您是有意（或无意）导出的。原始
mapDispatchToProps
正常
bindActionCreators
在调用
dispatch（）
时包装动作创建者。不过，我建议，如果您不太了解
dispatch（）
的工作原理，您不应该使用
bindActionCreators
，因为它在一个概念上添加了一个潜在的混乱层，许多人在第一次开始使用redux时已经感到困惑。@PirateJohn这也可能有助于解决
default
问题：@skypecakes good know。我现在必须阅读
bindActionCreators
。）非常感谢。我试过了，但是我得到了一个不同的错误，它说“uncaughttypeerror:（0，_index2.default）不是函数”（哦，我可能会在工作完成后删除组件状态——我在添加了该部分后更改了设计。谢谢你的评论。）很接近了。听起来这解决了你的问题。现在，您需要重新了解导入和导出的方式。听起来您可能有（或没有）一个
默认值
导出，而您是有意（或无意）导出的。原始
mapDispatchToProps
正常
bindActionCreators
在调用
dispatch（）
时包装动作创建者。不过，我建议，如果您不太了解
dispatch（）
的工作原理，您不应该使用
bindActionCreators
，因为它在一个概念上添加了一个潜在的混乱层，许多人在第一次开始使用redux时已经感到困惑。@PirateJohn这也可能有助于解决
default
问题：@skypecakes good know。我现在必须阅读
bindActionCreators
。）