Unable to see Icon using BottomTabNavigator in react-native

Question

I am trying to create a BottomTab navigator and when I refresh the file tabs.js, the icon is not showing at expo mobile app.

I think the main issue is at tabBarIcon

File 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 File

Thanks for help

Answer 1

This will work

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