React-JS TypeError：未定義のプロパティ 'setState'を読み取ることができません

Question

関数内でsetStateを呼び出そうとすると、「TypeError：プロパティ 'setState'が未定義です」というメッセージが表示されます。 代わりに矢印関数を宣言すると機能しますが、なぜわかりませんか？

import React, { Component } from 'react'; 

class Note extends Component { 
    constructor(props) { 
     super(props); 
     this.state = { 
      editing: false 
     } 
    } 

    edit(){ 
     this.setState({ editing: true }) 
    } 

    save() { 
     this.setState({ editing: false }) 
    } 

    renderEditNote() { 
     return (
      <div className="note"> 
       <textarea></textarea> 
       <button onClick={this.save}>SAVE</button> 
      </div> 
     ) 
    } 

    renderDisplayNote() { 
     return (
      <div className="note"> 
       <p>{this.props.children}</p> 
       <span> 
        <button onClick={this.edit}>Edit</button> 
        <button onClick={this.remove}>X</button> 
       </span> 
      </div> 
     ) 
    } 

    render() { 
     return this.state.editing ? this.renderEditNote() : this.renderDisplayNote() 
    } 
} 

export default Note 

Answer 1

理解するために、これらの方法ではconsole.log（this）を行うことができます。例えば

：

<button onClick={this.edit.bind(this)}>Edit</button> 

それともとしてconstructorでそれを行うことができます。

this.edit = this.edit.bind(this);

Answer 2

それが動作するようにするには、あなたが

this.save.bind(this) 
this.edit.bind(this) 
this.remove.bind(this) 

を行う必要がありますあなたはまだそれをバインドするので、これはあなたの方法の編集に（）、（保存）し、削除されていない（注）ではありませんクラス。 あなたはonClickによりバック呼び出されたとき、それが失われないようにするには、editとsave機能のためにbindthisに必要とする理由