Javascript react native中的TabNavigator自定义图标错误

我使用的是

Xcode 10

&最新的

react native

版本。 我用

TabNavigator

创建了

StackNavigator

应用程序

代码：navigation.jsClass

import React from "react";
import { TabNavigator, StyleSheet, Text, View, Image} from "react-navigation";

import Dashboard from '.././Screen/Dashboard'
import Home from '.././Screen/Home'
import Events from '.././Screen/Events'
import Settings from '.././Screen/Settings'


export default Tab = TabNavigator({
  Home: {
    screen: Home,
  },
  Settings: {
    screen: Settings,
    navigationOptions: {
          tabBarLabel: 'Settings',
          tabBarIcon: ({ tintColor }) => (
            <Image source={require('.././assets/setting.png')}
            style= {{width:15, height:15, tintColor:'black'}}>
            </Image>
        )
    },
  },
  Events: {
    screen: Events,
    },
  }, {
  tabBarPosition: 'bottom',
  swipeEnabled: true,
  tabBarOptions: {
    showIcon: true,
    activeTintColor: '#f2f2f2',
    activeBackgroundColor: "#2EC4B6",
    inactiveTintColor: '#666',
    labelStyle: {
      fontSize: 16,
      padding:4,
    }
  }
});

那么，它的工作完全没有图标。 我搜索了所有内容，但没有找到解决方案。

请尝试此操作（假设您正在创建底部导航器，并且您拥有最新的react导航）

从'react navigation'导入{createBottomTabNavigator}；
导出默认CreateBoottomTabNavigator({
主页：{
屏幕：主页，
},
设置：{
屏幕：设置，
导航选项：{
tabBarLabel:“设置”，
tabBarIcon:（{tintColor}）=>(
)
},
},
活动：{
屏幕：事件，
},
}, {
tabBarPosition:'底部'，
是的，
选项卡选项：{
showIcon：没错，
activeTintColor:“#f2f2f2”，
activeBackgroundColor:#2EC4B6“，
颜色：“#666”，
标签样式：{
尺寸：16，
填充：4，
}
}
});

tabBarIcon: ({ tintColor }) => (
                <Image source={require('.././assets/setting.jpeg')}
                style= {{width:15, height:15, tintColor:'black'}}>
                </Image>
            )

import { createBottomTabNavigator } from 'react-navigation';

export default createBottomTabNavigator({
  Home: {
    screen: Home,
  },
  Settings: {
    screen: Settings,
    navigationOptions: {
          tabBarLabel: 'Settings',
          tabBarIcon: ({ tintColor }) => (
            <Image source={require('.././assets/setting.png')}
            style= {{width:15, height:15, tintColor:'black'}}>
            </Image>
        )
    },
  },
  Events: {
    screen: Events,
    },
  }, {
  tabBarPosition: 'bottom',
  swipeEnabled: true,
  tabBarOptions: {
    showIcon: true,
    activeTintColor: '#f2f2f2',
    activeBackgroundColor: "#2EC4B6",
    inactiveTintColor: '#666',
    labelStyle: {
      fontSize: 16,
      padding:4,
    }
  }
});