我正在嘗試自定義反應本機導航，在使用道具選項時遇到一些問題這是我的 app.js 代碼    import { NavigationContainer } from '@react-navigation/native';import {createBottomTabNavigator} from '@react-navigation/bottom-tabs'import { StatusBar } from 'expo-status-bar';import React from 'react';import { StyleSheet, Text, View } from 'react-native';import Home from './Screens/home';import Orders from './Screens/orders';import Account from './Screens/account';import TabComponent from './components/Tab'const Tab = createBottomTabNavigator()export default function App() {  return (         <NavigationContainer>        <Tab.Navigator>          <Tab.Screen  name="Home" component={Home} options={{            tabBarButton: (props) => <TabComponent label="home" {...props} />,          }} />          <Tab.Screen  name="My Orders" component={Orders} />          <Tab.Screen  name="Account" component={Account} />        </Tab.Navigator>      </NavigationContainer>     );}const styles = StyleSheet.create({  container: {    flex: 1,    backgroundColor: '#fff',     },});這是我的 tabs.js 代碼import React from 'react';import { TouchableWithoutFeedback } from 'react-native-gesture-handler';import styled from 'styled-components/native';import Images from '../images';const  Container = styled.TouchableWithoutFeedback``;const Background = styled.View``;const Icon = styled.Image``;const Label = styled.Text``;function Tab(label, accessibilityState ){    const active = accessibilityState.selected;    const icon = !active ? Images.icons[label] : Images.icons[ `${label}Active` ];    return(        <Container>            <Background>                <Icon source={icon}/>                <Label>{label}</Label>            </Background>        </Container>    );}export default Tab;