從父母到孩子的傳遞函數

Question

我在JavaScript中有點弱。 我在鼓勵自己從this答案在REACT中傳遞一個函數從父母到孩子，我有一點困難。

有人能幫我糾正我的代碼嗎？ 謝謝！

var List = React.createClass({ 
    deleting: function(test){ 
    console.log(test); 
    }, 
    render: function() {  
    var all = this.props.activities; 
    var test = List.deleting; 
    var list = all.map(function(a){ 
     return (<ListItem act={a} del={test}>); 
    }); 

    return (
     <ul> {list} 
     </ul> 
    ); 
    } 
}); 

var ListItem = React.createClass({ 
    deleting: function(e){ 
    this.props.del(e.target.parentNode.firstChild.innerHTML); 
    }, 
    render: function(){ 
    return (
     <li key={this.props.act}>{this.props.act} 
     <div onClick={this.deleting}>X</div> 
     </li> 
    ); 
    } 
}); 

的錯誤，我得到：

Answer 1

你需要通過參考方法.deleting即List對象，你現在正在試圖通過VAR test = List.deleting;是undefined的一部分。爲了this在.map，是指List，你應該自己設定this爲.map - 這樣做，只是傳遞（在我們的情況下，它應該是this因爲this在渲染方法是指List）第二個參數.map，並傳遞給del=屬性參考方法this.deleting。

還設置key屬性爲ListItem，並在React all tags must be closed - 所以在ListItem標籤

var List = React.createClass({ 
    deleting: function(test) { 
    console.log(test); 
    }, 

    render: function() {  
    var all = this.props.activities; 
    var list = all.map(function(a) { 
     return (<ListItem key={a} act={a} del={this.deleting} />); 
    }, this); 

    return <ul> {list} </ul> 
    } 
}); 

Example

的末尾添加 />（ 現在你得到錯誤，因爲你沒有關閉標籤ListItem）