沒有參數的道具方法並沒有得到子組件稱爲反應

我是新來的反應，JS，我需要在部件的方法結合一些澄清沒有參數的道具方法並沒有得到子組件稱爲反應

我有2個部件爲父級和ChildComponent

父

var ParentComponent = React.createClass({ 

methodArg: function (value) { 
    console.log("methodArg called", value); 
}, 

methodNoArg: function() { 
    console.log("methodNoArg called"); 
}, 

render: function() { 
    return <ChildComponent m1={(value) => this.methodArg(value)} m2={() => this.methodNoArg} /> 
} 

})

兒童

var ChildComponent = React.createClass({ 
render: function() { 
    return (
     <div> 
      <button onClick={()=>this.props.m1(100)}>Call M1</button> 
      <button onClick={()=>this.props.m2()}>Call M2</button> 
     </div> 
    ) 
} 
})

當我點擊呼叫M1按鈕，methodArg（）母公司獲取調用。

但是當我點擊致電M2methodNoArg（）沒有被調用。這有什麼問題？

當我通過methodNoArg於兒童，它獲取調用

<ChildComponent m1={this.methodArg()} m2={this.methodNoArg} />

但methodArg（）獲取調用沒有點擊該按鈕，它獲取調用每次當子組件呈現。

來源

2016-12-02 John

你缺少'（）''後this.methodNoArg' - 'this.methodNoArg'返回指針'function'，你還是要調用它 – pwolaq

<button onClick={()=>this.props.m1(100)}>Call M1</button>

你上面一行是說評估M1方法和分配結果的onClick。所以，當你刷新你的頁面時，你的console.log語句中你傳遞的值會被打印出來，但無論你點擊多少次，onClick現在都沒有方法賦值，它將永遠不會被再次調用。

您可以通過刪除自動調用該方法的括號而不點擊來實現所需的功能。

這裏工作的jsfiddle代碼鏈接： http://jsfiddle.net/fp0LvkLg/

來源

2016-12-02 16:26:54 Vikas

箭頭函數只是一種綁定方式。 {this.props.m1.bind（this，100）}與{（）=> this.props.m1（100）}相同。在你的jsfiddle代碼中。嘗試刪除綁定並檢查。方法m1將在單擊按鈕之前調用。 – John

檢查這個http://jsfiddle.net/john1jan/nu6ydt09/1/ – John

你是對的，有微不足道的區別箭頭和綁定，除非你不能使用新的n更多的箭頭。但在你上面的jsfiddle中，如果我正確地檢查，你是沒有約束力的。 – Vikas

這是因爲您將其分配方法的道具

m2={() => this.methodNoArg}

是（那種，如果我們忽略的this複雜性），相當於

m2={function() {return this.methodNoArg}}

這樣的方式你的道具是一個函數，它返回一個函數，而函數又不會被調用。

你想簡單的功能分配給這樣的道具：

m2={this.methodNoArg}

來源

2016-12-02 13:01:07 Mchl

但我在子節點this.props.m2（）中調用方法m2。哪個是方法調用？ – John

你的意思是有一個函數只返回方法對象的函數。如果我調用this.props.m2（）它返回this.methodNoArg，但不調用methodNoArg？ – John

是的，這就是發生了什麼 – Mchl

沒有參數的道具方法並沒有得到子組件稱爲反應

回答

相關問題