javascript - 在 react-native 中使用 BottomTabNavigator 看不到图标

Question

我正在尝试创建一个BottomTab导航器，当我刷新文件 tabs.js 时，该图标未显示在 expo 移动应用程序中。

我认为主要问题在于 tabBarIcon

文件 tab.js

import React from "react"
import {
    View,
    Image,
    TouchableOpacity
} from "react-native"
import {createBottomTabNavigator, BottomTabBar} from "@react-navigation/bottom-tabs"
import Home from "../screens/Home"
import { COLORS, icons } from "../constants"
import {Ionicons} from "@expo/vector-icons"

const Tab = createBottomTabNavigator();
const Tabs = () => {
    return (
        <Tab.Navigator
        >
            <Tab.Screen
             

            name="Home"
            component={Home}
            s
            options={{
            
                
                tabBarIcon: ({focused})=> {
                <Ionicons name="cart-outline" size={16} color= "#000000"
              } 
            }}
                />
        </Tab.Navigator>
    )
}

export default Tabs;

Home.js 文件

感谢帮助

标签： javascriptreact-nativeexpotabnavigatorreact-navigation-bottom-tab

Answer 1

这将起作用

    <Tab.Navigator>
        <Tab.Screen
            name="Home"
            component={Dashboard}
            options={{
                tabBarIcon: ({}) => (
                <Ionicons name="cart-outline" size={16} color="#000000" />
            ),
            }}
        />
    </Tab.Navigator>