component 間 互相存取

Component互相存取

如果不用context API或 redux 時可用以下方法在組建間傳遞prop或method。

1.https://github.com/kriasoft/react-starter-kit/issues/909#issuecomment-252969542

openDrawer = () => {
  this.drawer.openTheDrawer();
};

<Drawer onRef={ref => (this.drawer = ref)}>
  .....
   <button onClick={() => this.openDrawer()} />
</Drawer>

Drawer.js

  componentDidMount() {
    this.props.onRef(this)
  }
  openTheDrawer(){
    ....
  };

  render(){
     <div>
        ......
       {this.props.children}
     </div> 
  }

這樣就可以存取到parent (Drawer) 的function，或是可在parent寫static function，但注意static function 沒有this

Passing child red to parent

React - How to pass `ref` from child to parent component?Stack Overflow

現在新的 hook 方法要參考：

https://stackoverflow.com/questions/37949981/call-child-method-from-parent