[英]react-navigation v5: Exception thrown: createStackNavigator is not a function
I am very new to React, if you need any more information let me know and I can provide.我对 React 很陌生,如果您需要更多信息,请告诉我,我可以提供。 I am trying to add bottom tabs.
我正在尝试添加底部标签。 I have followed the react-navigation documentation to the best of my ability.
我已尽我所能遵循 react-navigation 文档。 I have also scoured the forms and found a few similar questions, but still could not work it out.
我也搜索了表格并发现了一些类似的问题,但仍然无法解决。 Thank you for the help.
感谢您的帮助。
import React from 'react';
import { createStackNavigator } from "@react-navigation/stack";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
import Icon from 'react-native-ionicons';
import Ionicons from 'react-native-vector-icons/Ionicons'
import GreenScreen from "./GreenScreen";
import RedScreen from "./RedScreen";
const GreenStack = createStackNavigator ();
function GreenStackScreen() {
return (
<GreenStack.Navigator>
<GreenStack.Screen name="Green" component={GreenScreen}/>
<GreenStack.Screen name="Red" component={RedScreen}/>
</GreenStack.Navigator>
);
}
const RedStack = createStackNavigator ();
function RedStackScreen() {
return (
<RedStack.Navigator>
<RedStack.Screen name="Green" component={GreenScreen}/>
<RedStack.Screen name="Red" component={RedScreen}/>
</RedStack.Navigator>
);
}
const Tab = createBottomTabNavigator();
export default function BottomTabs() {
return (
<Tab.Navigator
screenOptions={({route}) => ({
tabBarIcon: ({color, size}) => {
let iconName;
if (route.name ==='Green') {
iconName='home'
}else if(route.name ==='Red'){
iconName='grid'
}
return <Ionicons name={iconName} size={20} />
}
})} >
<Tab.Screen name="Green" component={GreenStackScreen}/>
<Tab.Screen name="Red" component={RedStackScreen} />
</Tab.Navigator>
)
}
Your imports are wrong You should import like below你的进口是错误的你应该像下面这样进口
import { createStackNavigator } from '@react-navigation/stack';
And the bottom navigator should be imported like below底部导航器应该像下面一样导入
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.