在 React Nativ 中單擊該選項卡時,如何將引數或物件傳遞給選項卡螢屏?這是應用程式一頁上底部標簽導航的代碼。
const Tab = createBottomTabNavigator();
function MainContainer({ route, navigation }) {
//function MainContainer({ }) {
// Load the icon font before using it
const [fontsLoaded] = useFonts({ IcoMoon: require('../../assets/icomoon/zepra_icons.ttf') });
const { data } = route.params;
console.log('data:');
console.log(data);
if (!fontsLoaded) {
return <AppLoading />;
}
return (
<Tab.Navigator
initialRouteName={projectsName}
screenOptions={({ route }) => ({
headerShown: false,
tabBarIcon: ({ focused, color, size }) => {
let iconName;
let rn = route.name;
if (rn === projectsName) {
iconName = focused ? 'PROJEKTE_ALLE' : 'PROJEKTE_ALLE';
} else if (rn === waermeschutzName) {
iconName = focused ? 'HAUS_3' : 'HAUS_3';
} else if (rn === begehungenName) {
iconName = focused ? 'NOTIZ_ERSTELLEN' : 'NOTIZ_ERSTELLEN';
}
return <Icon name={iconName} size={43} color={color} />;
},
'tabBarActiveTintColor': '#4283b1',
'tabBarInactiveTintColor': '#5db8bd',
'tabBarStyle':{ 'paddingTop':4, 'height':90 },
'tabBarLabelStyle':{ 'paddingTop':3, 'fontSize':13 }
})}>
<Tab.Screen name={projectsName} component={ProjectsScreen} />
<Tab.Screen name={waermeschutzName} component={WaermeschutzScreen} />
<Tab.Screen name={begehungenName} component={BegehungenScreen} />
</Tab.Navigator>
);
}
export default MainContainer;
我嘗試了幾種方法,但無法使其正常作業。有沒有人有一個可行的例子或有人幫我寫代碼?
謝謝
uj5u.com熱心網友回復:
您可以對組件使用initialParams 屬性Tab.Screen,以便將初始引數傳遞給每個選項卡。
這是有關如何為您的第一個選項卡螢屏執行此操作的示例。
<Tab.Screen name={projectsName} component={ProjectsScreen} initialParams={{ data }} />
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/487039.html
標籤:反应式 反应原生导航 react-native-tabnavigator
