Javascript 反应在onClick中调用多个事件处理程序会导致“Null”或“undefined”

我有两个事件处理程序，一个在子组件counter.js中，另一个由props传递，props是父容器.js

我想将事件传递到onClick，但是我一次只能让一个事件工作，不能同时让两个事件工作。我试着编写一个函数来保存这两个事件，并使用onClick，但随后出现了错误

如果我只使用其中一个，两个事件函数都会查找，但同时使用两个事件往往会中断。我能再看一眼我做错了什么吗

在我的父组件container.js中，我将其作为道具传递：

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

    this.moveCard = this.moveCard.bind(this);
    this.state = {
      id: players.id,
      totalScore: 0,
      countInfo: [],
      evilName: '',
      color: '#6E68C5',
      scoreColor: '#74D8FF',
      fontAwe: 'score-icon',
      incrementcolor: '',
      scoreNameColor: 'white',
      glow: '',
      buttonStyle: 'count-button-start'
    };

    this.incrementCountTotal = this.incrementCountTotal.bind(this);
    this.decrementCountTotal = this.decrementCountTotal.bind(this);
  }

  incrementCountTotal() {
    this.setState({
      totalScore: this.state.totalScore + 1
    });
  }

  decrementCountTotal() {
    this.setState({
      totalScore: this.state.totalScore - 1
    });
  }

  moveCard(dragIndex, hoverIndex) {
    const { cards } = this.state;
    const dragCard = cards[dragIndex];

    this.setState(
      update(this.state, {
        cards: {
          $splice: [[dragIndex, 1], [hoverIndex, 0, dragCard]]
        }
      })
    );
  }

  sortableGroupDecorator = componentBackingInstance => {
    if (componentBackingInstance) {
      let options = {
        group: 'shared'
      };
      Sortable.create(componentBackingInstance, options);
    }
  };

  render() {
    const listPlayers = players.map(player => (
      <Counter
        key={player.id}
        player={player}
        name={player.name}
        sortableGroupDecorator={this.sortableGroupDecorator}
        decrementCountTotal={this.decrementCountTotal}
        incrementCountTotal={this.incrementCountTotal}
      />
    ));
    return (
      <ContainLeft style={{ alignItems: 'center' }}>
        <ProjectTitle>Score Keeper</ProjectTitle>
        <Copy>
          A sortable list of players that with adjustable scores.  Warning, don't go negative!
        </Copy>
        <div>
          <Stats totalScore={this.state.totalScore} players={players} />
          {listPlayers}
        </div>
      </ContainLeft>
    );
  }
}

export default Container;

所以当我加上：

onClick={this.incrementCount，incrementCountTotal}只有incrementCountTotal可以使用第二个参数

如果我用这样的函数内联编写它

onClick={event => {
  this.incrementCount;
  incrementCountTotal;
}}

什么都不管用

如果我写一个函数来处理这两个问题，它会给出未定义的结果

  onClick(event) {
    incrementCountTotal, incrementCount;
  }

然后把onClick={this.onClick}我得到：

---

在子组件中，似乎只需要调用函数添加括号。此外，incrementCountTotal是一个道具，因此可以这样称呼它：

  onClick={event => {
    this.incrementCount();
    this.props.incrementCountTotal();
  }
}

---

你能把错误包括进来吗？用错误更新了我的问题，又更新了一次我不能告诉你我有多感激你为我回答这个问题

./src/components/pages/projectpages/dnd2/Counter.js
  Line 97:  'incrementCountTotal' is not defined  no-undef
  Line 97:  'incrementCount' is not defined       no-undef

  onClick={event => {
    this.incrementCount();
    this.props.incrementCountTotal();
  }
}