更改屏幕 react-native 的标题

Question

我正在使用 react-native-tab-navigator：

https://github.com/happypancake/react-native-tab-navigator

<TabNavigator style={styles.container}>
    <TabNavigator.Item
      selected={this.state.selectedTab === 'home'}
      title="Home"
      selectedTitleStyle={{color: "#3496f0"}}
      renderIcon={() => <Icon name="home" size={px2dp(22)} color="#666"/>}
      renderSelectedIcon={() => <Icon name="home" size={px2dp(22)} color="#3496f0"/>}
      onPress={() => this.setState({selectedTab: 'home'})}>
      <SideMenu menu={MenuComponent}>
        <HomeScreen/>
      </SideMenu>
    </TabNavigator.Item>
    <TabNavigator.Item
      selected={this.state.selectedTab === 'links'}
      title="Links"
      selectedTitleStyle={{color: "#3496f0"}}
      renderIcon={() => <Icon name="user" size={px2dp(22)} color="#666"/>}
      renderSelectedIcon={() => <Icon name="user" size={px2dp(22)} color="#3496f0"/>}
      onPress={() => this.setState({selectedTab: 'links'})}>
      <SideMenu menu={MenuComponent}>
        <LinksScreen/>
      </SideMenu>
    </TabNavigator.Item>
  </TabNavigator>

我的屏幕配置如下：

// app/index.js

import React, { Component } from 'react';
import { Router, Scene } from 'react-native-router-flux';

import HomeScreen from './containers/HomeScreen';
import LinksScreen from './containers/LinksScreen';
import TabNavScreen from './containers/TabNavScreen';

const MyApp = () => {
  return (
    <Router>
      <Scene key="root">
        <Scene key="home"
          component={HomeScreen}
          title="Home"
        />
        <Scene
          key="links"
          component={LinksScreen}
          title="Links"
        />
        <Scene key="tabNav"
          component={TabNavScreen}
          title="Home"
          initial
        />
      </Scene>
    </Router>
  );
}

export default MyApp;

当我更改标签时，我需要更改主屏幕的标题。现在它被固定在主页上，我尝试的任何东西似乎都不成功。

提前感谢您的帮助。

Answer 1

如果您将标题作为道具传递，您应该可以通过将title="TITLE" 更改为title={this.props.title} 来访问它