1. 程式人生 > >ReactNative組件間的通信

ReactNative組件間的通信

prop func pos 傳值 blog child 參考 code post

參考:https://www.jianshu.com/p/f908fdc654b4

父組件向子組件通信

  • 父組件向子組件傳值
  • 通過props傳遞 在父組件中name=‘我是父組件向子組件傳遞的參數‘
  • 在子組件中通過this.props.name獲取
  • 父組件向子組件傳遞方法
  • 與傳遞參數方法相同,通過props方法這樣傳遞test={this.onParentClick1}
  • 在子組件中觸發這個方法this.props.test();

子組件向父組件通信

  • 子組件向父組件傳值
  • 在子組件state中定義一個參數this.state = {name : ‘我是子組件向父組件傳遞的參數‘ };
  • 在父組件中給子組件綁定ref
    ,如 <Childern ref=‘childern‘ />
  • 在父組件中獲取子組件的state,如this.refs.childern.state.name
  • 子組件向父組件傳遞方法
  • 同樣通過ref來獲得,前兩部與傳參方法相同。
  • 獲取方法的方式也同樣this.refs.childern.onChildenCilck2();

非父子組件之間的傳值

  • 組件之間無關聯的形式與子組件向父組件傳值的方式相同
  • 通過ref給組件標記一個名字,同樣通過this.refs.***.state/function方法相互調用。

ReactNative組件間的通信