2017-07-29 66 views
1

我檢查了這個錯誤的stackoverflow和唯一的結果,我已經得到的是,功能需要綁定與此。 但我已經在我的代碼中這樣做了,錯誤仍然存​​在。 我不知道爲什麼會發生這種情況。 上CodePen完整的代碼和下面反應未捕獲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

呃。

您實際上在calculate方法中創建了您的實例的setState屬性的本地副本,並在開始本地解析時將原始鏈斷開爲React.Component

這是錯誤:

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

額外=是賦值。任何後續調用setState將失敗

+0

但是'setState'不是一個變量,你可以給它賦值... –

+0

這就是整個觀點。 Prototype鏈找到一個ownProperty'setState',它不再是一個函數 –

+1

所以換句話說,我意外地分配了setState,這就是導致問題的原因。並且所有對它的調用都不會起作用,從而導致它不再是一個函數。非常感謝! – Eric

0

縮短的副本不需要重新綁定在構造爲箭頭的功能回調繼承封裝類的情況下(在這種情況下,組件)。

+0

不幸的是,情況並非如此。 –

+0

我重印了他們,因爲我認爲這將解決問題,但它不起作用綁定或解除綁定。有誰知道爲什麼會發生這種情況?我只是想練習和學習React – Eric

相關問題