更改活動 TabBarIcon 的顏色 React Native

Question

類似於這個問題，但我也想更改圖標的顏色 - 不僅僅是文本。

這是有問題的代碼：

HomeStack.navigationOptions = {
  tabBarLabel: 'Home',
  tabBarOptions: {
    activeTintColor: '#6CC7BD',
    inactiveTintColor: '#CCCCCC',
  },
  tabBarIcon: ({focused}) => (
    <TabBarIcon
      focused={focused}
      name={
        Platform.OS === 'ios'
          ? `ios-information-circle${focused ? '' : '-outline'}`
          : 'md-information-circle'
      }
    />
  )
}

根據Github 上的這個線程，我應該試試這個：

HomeStack.navigationOptions = {
  tabBarLabel: 'Home',
  tabBarOptions: {
    activeTintColor: '#6CC7BD',
    inactiveTintColor: '#CCCCCC',
  },

  tabBarIcon: ({focused}) => <TabBarIcon name={
    Platform.OS === 'ios'
      ? `ios-information-circle${focused ? '' : '-outline'}`
      : 'md-information-circle'
  } color={this.activeTintColor}/>
}

但是信息圈還是灰色的：

還嘗試了color={this.tabBarOptions.activeTintColor} ，這導致了錯誤：

還有其他建議嗎？

編輯- 也試過：

HomeStack.navigationOptions = {
  tabBarLabel: 'Home',
  tabBarOptions: {
    activeTintColor: '#6CC7BD',
    inactiveTintColor: '#CCCCCC',
  },
  tabBarIcon: ({activeTintColor}) => (
    <TabBarIcon
      activeTintColor={activeTintColor}
      name={
        Platform.OS === 'ios'
          ? `ios-information-circle${activeTintColor ? '' : '-outline'}`
          : 'md-information-circle'
      }
      color={this.activeTintColor}
    />
  )
}

Answer 1

您是否嘗試添加所有道具：

tabBarIcon: ({focused, ...restProps}) => (
    <TabBarIcon
      name={
        Platform.OS === 'ios'
          ? `ios-information-circle${activeTintColor ? '' : '-outline'}`
          : 'md-information-circle'
      }
      focused={focused}
      {...restProps}
    />
  )