読者です 読者をやめる 読者になる 読者になる

【react】Expected onClick listener to be a function, instead got type stringエラー対応

はじめに

reactをes6で使った場合です。
地味にはまった。。。自分の場合は以下の2パターン

> パターン1

イベントリスナーでメソッド呼び出すときにbindしていない

export default class Sample extends React.Component
{
  onClick() {
    console.log(this.status);
  }

  render() {
    return (
      <div>
        <button onClick={this.onClick}>ボタン</button>
      </div>
    );
  }
}

解決1

<button onClick={this.onClick.bind(this)}>ボタン</button>

解決2

this.onClick = this.onClick.bind(this);

> パターン2
onClickを"(ダブルクォート)で囲っていた。。。

<button onClick="{this.onClick(this)}">ボタン</button>

今回はパターン2の落ちでした。。。以上です