reactjs - react-navigation 自定义 TabNavigator 生成的组件

Question

使用 react-navigation，为了实现这一点：

我嵌套TabNavigator在一个StackNavigator. 代码如下：

const HomeTabs = TabNavigator(
  {
    Portfolio: { screen: PortfolioScreen },
    Holding: { screen: HoldingScreen }
  },
  {
    //other configs
  }
)

const RootNavigator = StackNavigator(
  {
    Home: { screen: HomeScreen },
  },
  {
    // other configs
  }
)

//in App.js render()
return (
  <Provider store={Store}>
    <View style={{flex: 1}}>
      <RootNavigator />
    </View>
  </Provider>
)

现在，我需要投资组合和持有选项卡上的浮动操作按钮。我不想在PortfolioScreen和HoldingScreen组件中添加两次。

有没有办法可以自定义HomeTabsTabNavigator 生成的组件？喜欢给它额外的东西来渲染？是否有我缺少的 HOC API？就像是：

class CustomizedHomeTabs extends React.Component {
  onFabPress = () => { // do stuffs }

  render() {
    return (
      <FAB onPress={this.onFabPress}></FAB>
    )
  }
}

export default withTabNavigator(routes, config)(CustomizedHomeTabs) //something like this would be cool!