2017-07-29 15 views
1

私はこのエラーのためにstackoverflowをチェックしましたが、私が得た唯一の結果は関数をこれにバインドする必要があるということです。 しかし、私は自分のコードで行っており、エラーは依然として続きます。 なぜこれが起こっているのか理解できません。 CodePen上の完全なコードと矢印機能は、囲むクラス(この場合はコンポーネント)のコンテキストを継承してあなたは、コンストラクタでコールバックを再バインドする必要はありませんReact Uncaught TypeError:_this2.setStateは関数ではありません

class MainComponent extends React.Component{ 
    constructor(props) { 
    super(props); 
    this.setOperand = this.setOperand.bind(this); 
    this.calculate = this.calculate.bind(this); 
    this.updateValue = this.updateValue.bind(this); 
    this.state = { 
     currentValue: 0, 
     secondValue: 0, 
     operand: null, 
     isNewNum: false 
    }; 
    } 

    setOperand = (value) => { 
    //set data from input 
    }; 

    calculate =() => { 
    //math stuff 
    this.setState = ({ 
     currentValue: result, 
     isNewNum: false 
    }); 
    }; 

    updateValue = (value) => { 
    if(!this.state.isNewNum){ //first Number 
     var newNum = ""; 
     //set values 
     this.setState({ 
     currentValue: newNum 
     }); 
    } else { 
     var newNum2 = ""; 
     //set values 
     this.setState({ 
     secondValue: newNum2 
     }); 
    } 
    }; 

    render(){ 
    return(
     <div id="main"> 
     <p>isNewNum = {`${this.state.isNewNum}`}</p> 

     {this.state.isNewNum ? <Display display ={this.state.secondValue}/> : <Display display ={this.state.currentValue}/>} 
     <div> 
      <Buttons value={1} onClick={this.updateValue}/> 
      ... 
      <Buttons value={'+'} onClick={this.setOperand}/> 
     </div> 
     </div> 
    ) 
    }; 
} 


ReactDOM.render(<MainComponent />, document.getElementById("root")); 

答えて

2

er。

実際には、計算メソッドでインスタンスのsetStateプロパティのローカルコピーを作成し、プロトタイプチェーンをローカルで解決するときにReact.Componentに分割します。余分=割り当てをある

this.setState = ({ 
    currentValue: result, 
    isNewNum: false 
}); 

この

はエラーです。その後の setStateの呼び出しは失敗します

+0

しかし、 'setState'はあなたが値を割り当てることができる変数ではありません... –

+0

それは全体のポイントです。プロトタイプチェーンは独自のプロパティ 'setState'を見つけ、それはもはや関数 –

+1

ではありません。つまり、私は誤ってsetStateを割り当てました。それが問題の原因です。それへのすべての呼び出しは機能しなくなりました。どうもありがとうございます! – Eric

0

以下短絡コピー。

+0

残念なことに、そうではありません。 –

+0

私はそれが問題を解決すると思ったので、私は再バインドしましたが、バインドやアンバインドは機能しません。誰がなぜこれが起こっているのか知っていますか?私はちょうど練習し、学ぶことを試みているReact – Eric

関連する問題