この文書の現在のバージョンと選択したバージョンの差分を表示します。
次のリビジョン | 前のリビジョン | ||
reactnative:react-navigation [2019/02/13 01:10] ips 作成 |
reactnative:react-navigation [2019/03/08 06:20] (現在) ips |
||
---|---|---|---|
ライン 1: | ライン 1: | ||
- | ====== navigation ====== | + | ====== react-navigation====== |
+ | |||
+ | ====== インストール ====== | ||
+ | <code> | ||
+ | npm install --save react-navigation | ||
+ | </code> | ||
===== イベント ===== | ===== イベント ===== | ||
ライン 11: | ライン 16: | ||
this.props.navigation.addListener('didBlur', () => console.log('didBlur')) | this.props.navigation.addListener('didBlur', () => console.log('didBlur')) | ||
} | } | ||
+ | </code> | ||
+ | |||
+ | ↓も同じ [[https://reactnavigation.org/docs/en/navigation-events.html|NavigationEvents reference]] | ||
+ | イベントを発生させたいコンポーネントのViewの下に追加すればいい。(importが必要) | ||
+ | <code> | ||
+ | import { NavigationEvents } from 'react-navigation' | ||
+ | |||
+ | return ( | ||
+ | <View style={styles.view}> | ||
+ | <NavigationEvents | ||
+ | onWillFocus={() => console.log('will focus')} | ||
+ | onDidFocus={() => console.log('did focus')} | ||
+ | onWillBlur={() => console.log('will blur')} | ||
+ | onDidBlur={() => console.log('did blur')} | ||
+ | /> | ||
</code> | </code> |