React Native Router Flux 自定义图标答案

【问题标题】：React Native Router Flux custom IconReact Native Router Flux 自定义图标
【发布时间】：2016-12-30 22:51:20
【问题描述】：

这是我的第一个问题，如果我犯了任何错误，请原谅我。

我正在尝试使用 React 本机路由器通量为 IOS 自定义导航栏图标，但我不知道如何检索我的自定义图标（png 文件）在某些示例中，他们使用 icon={tabIcon} 像这样，但我需要要做的是描述图像源的路径，但我不知道如何以正确的语法键入它。

任何帮助将不胜感激。谢谢。

这是我的代码：

      <Scene key="root">
        <Scene key="tabbar" tabs>

          <Scene key="tab2"  title="Categories"  **icon={TabIcon}**  >
            <Scene key="categories" component={Categories} title="Categories" initial />
            <Scene hideTabBar key="categorylisting" component={CategoryListing} title="Adventure" />
            <Scene hideTabBar key="showdetails" component={ShowDetails} title="TV Show Details"  />
          </Scene>

【问题讨论】：

标签： react-native react-native-router-flux

【解决方案1】：

文档中似乎缺少它，但它是这样完成的。

function CustomIcon(props) {
  return (
    <View>
      <Image
        source={iconSource}
        style={{ width: 22, height: 25 }}
        tintColor={'red'}
      />
      <Text>Tab1</Text>
    </View>
  );
}

<Scene key="tab1" icon={CustomIcon} >
</Scene>

【讨论】：

谢谢。我不知道 icon={CustomIcon} 必须是一个组件。我认为它可以是一个变量，指定图标资产的路径。非常感谢。