- 反応するネイティブ・タブナビゲータを達成：
bottom.jsコードは次のとおりです。
インポートは、「REACT」から{コンポーネント}、リアクト;
「REACT-ネイティブ」からインポート{スタイルシート、ビュー、テキスト、画像} ;
インポート「REACT-ネイティブTabNavigatorコンテナ」からTabNavigatorコンテナ
輸出デフォルト{クラスボトムインクルードは、コンポーネントを拡張 / *初期化*状態/ コンストラクタ（小道具）{ スーパー（）; this.state = {selectedTab 'tb_msg' 、}} / ** * @param selectedTab方法共通コンポーネント選択タブ* @paramタイトル* @paramアイコン* @param 選択されたアイコンの色レンダリングselectedIcon * @param imageStyle * @paramマーク添字* @param viewContentページコンテンツ@Returns {*} * / tabNavigatorItems（selectedTab、タイトル、アイコン、selectedIcon、imageStyle、マーク、viewContent）{リターン（ < TabNavigator.Item選択さ=== = {this.state.selectedTabselectedTab}タイトル= {タイトル} renderIcon = {（）=> <画像スタイル= {styles.myImage}ソース= {アイコン} />} renderSelectedIcon = {（）=> <画像スタイル= {[styles.myImage、{tintColor ：imageStyle}]}ソース= {selectedIcon} />} badgeText = {マーク}たonPress = {（）=> this.setState（{selectedTab：selectedTab}）}> <ビュースタイル= {{フレックス：1}}> <テキスト> {viewContent} </テキスト> </表示> </TabNavigator.Item> ）}（）{リターンレンダリング（<ビュースタイル= {} styles.container> <TabNavigatorコンテナ> {this.tabNavigatorItems（ 'tb_msg'、」消息"必要（ '../../資産/ IMG / zhuye.png'）、必要（" ../../資産/ IMG / zhuyesl.png "）、 '＃622193'、" ""消息页面内容」）} {this.tabNavigatorItems（ 'tb_contacts'、 "联系人"、../「（必要../assets/img/zhuye.png'),require("../../assets/img/zhuye.png"),'#65bb74」、 『』、 『連絡先のページの内容』）} {this.tabNavigatorItems（ 'tb_watch'は、 "看点"（ '../../資産/ IMG / zhuye.png'を必要とする）、（」../../資産/ IMG / zhuyeを必要とします。 PNG "）、 '＃1 6ebef3'、"」、 "看点页面内容" ）} {this.tabNavigatorItems（ 'tb_dynamic'、 "动态"、必要（ '../../資産/ IMG / zhuye.png' ）、（ "../../資産/ IMG / zhuye.png "）、 '＃622193'、""、 "动态页面の内容"が必要です。</ TabNavigatorコンテナ> </ビュー>}））; }} CONSTスタイル= StyleSheet.create（{コンテナ：{フレックス：1 、のbackgroundColor： '＃1 F5FCFF' 、}、MYIMAGE：{幅：22 、高さ：22 、}}）。
ラン：反応するネイティブ実行アンドロイド
結果：
