Just started learning React Native with Expo, trying to implement a top bar navigation.(刚刚开始通过Expo学习React Native，试图实现顶部栏导航。)
// screens/Home.tsx
function Home() {
return (
<View style={styles.container}>
<Text>Home Screen!</Text>
</View>
)
}
export default Home
// nav/MainTabNavigator.tsx
import {Ionicons} from '@expo/vector-icons'
import HomeScreen from '../screens/Home'
const HomeStack = createStackNavigator(
{
Home: HomeScreen
}
)
HomeStack.navigationOptions = {
tabBarIcon: ({focused}) => {
<Ionicons
focused={focused}
name='md-information-circle'
size={26}
style={{marginBottom: -3}}
color='green'
/>
}
}
HomeStack.path = ''
const tabNavigator = createMaterialTopTabNavigator({
HomeStack,
}, {
tabBarPosition: 'top',
swipeEnabled: true,
tabBarOptions: {
showIcon: true,
showLabel: true,
activeTintColor: 'white',
style: {
backgroundColor: 'red'
}
}
})
export default tabNavigator
// AppNavigator.tsx
import {createAppContainer, createSwitchNavigator} from 'react-navigation';
import MainTabNavigator from './MainTabNavigator'
const AppNavigator = createSwitchNavigator({
Main: MainTabNavigator
})
export default createAppContainer(AppNavigator)
The problem is icons are not showing.(问题是图标未显示。)
Imgur Link(图片链接)
Please help.(请帮忙。)
================================================================(================================================== ==============)
Stack: Expo, TypeScript, React-native-navigation, React-native-vector-icons, @expo/vector-icons(堆栈：Expo，TypeScript，React-native-navigation，React-native-vector-icons，@ expo / vector-icons)
ask by Rario translate from so
与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
