從父母調用React組件方法

Question

即時通訊新的反應，我想知道如何我可以從父級調用子組件方法？

例如

var ChildClass = class Child { 

    howDoICallThis() { 
    console.log('Called!') 
    } 

    render() { 
    return (<Text> Child Class </Text>) 
    } 
} 

var ParentClass = class Parent { 
    // how can i call child.howDoICallThis() ? 
    render() { 
    return (<ChildClass> </ChildClass>) 
    } 
} 

有人能解釋清楚我是如何做到這一點？

Answer 1

這不是真的應該如何在React中完成。處理這些情況的一種常見方式是在處理業務邏輯的容器組件中定義方法，然後將這些方法作爲道具傳遞給表示組件。

class Child extends Component { 
    render() { 
     return <Text onClick={this.props.handleClick}>Child Class</Text> 
    } 
} 

class Parent extends Component { 
    handleClick =() => { 
     console.log('Called!') 
    } 

    render() { 
     return <Child handleClick={this.handleClick} /> 
    }  
} 

基本上，你想傳遞的東西了，其中反應的目的是通過事物下來。你仍然可以使用refs和'提升狀態'（參見https://facebook.github.io/react/docs/lifting-state-up.html）來傳遞信息，但是就方法而言，你應該永遠只傳遞它們。如果你正確地構建你的組件，你不應該永遠不需要從父節點調用孩子的方法。

（順便說一句...確保要擴展組件。您在你錯過了此示例代碼）