如何在react-native-router-flux中组合标签和导航栏？

npm install react-native-router-flux --save

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

import Home from './components/Home';
import About from './components/About';
import Contact from './components/Contact';

render() {
  return (
    <Router>
      <Scene key="root">
        <Tabs key="tabbar" tabBarStyle={styles.tabBarStyle}>
          <Stack key="homeStack" title="Home" icon={TabIcon}>
            <Scene key="home" component={Home} title="Home" />
          </Stack>
          <Stack key="aboutStack" title="About" icon={TabIcon}>
            <Scene key="about" component={About} title="About" />
          </Stack>
          <Stack key="contactStack" title="Contact" icon={TabIcon}>
            <Scene key="contact" component={Contact} title="Contact" />
          </Stack>
        </Tabs>
      </Scene>
    </Router>
  );
}

const TabIcon = ({ focused, title }) => {
  let icon;
  switch (title) {
    case 'Home':
      icon = focused ? require('./images/home_active.png') : require('./images/home_inactive.png');
      break;
    case 'About':
      icon = focused ? require('./images/about_active.png') : require('./images/about_inactive.png');
      break;
    case 'Contact':
      icon = focused ? require('./images/contact_active.png') : require('./images/contact_inactive.png');
      break;
    default:
      break;
  }
  return (
    <Image source={icon} style={styles.tabIconStyle} />
  );
};