我试图将参数传递到我拥有的所有 3 个窗口的选项卡中。我只是不知道要在这里放置ScreenProps
,以及这是否是将参数发送到 3 个类的正确方法。参数是否也需要在此类中传递,或者当我在登录后导航到选项卡时this.props.navigation.navigate('Main',{name: "1"})
现在只是尝试传递名称 1 以在所有选项卡中获取它
import React from 'react';
import { Platform} from 'react-native';
import { createStackNavigator, createBottomTabNavigator } from 'react-navigation';
import TabBarIcon from '../components/TabBarIcon';
import HomeScreen from '../screens/HomeScreen';
import LinksScreen from '../screens/LinksScreen';
import Profile from '../screens/ProfileToUse';
const HomeStack = createStackNavigator({
Home: HomeScreen,
});
HomeStack.navigationOptions = {
tabBarLabel: 'Home',
tabBarIcon: ({ focused }) => (
<TabBarIcon
focused={focused}
name={
Platform.OS === 'ios'
? `ios-information-circle${focused ? '' : '-outline'}`
: 'md-information-circle'
}
/>
)
};
const LinksStack = createStackNavigator({
Links: LinksScreen,
});
LinksStack.navigationOptions = {
tabBarLabel: 'Contacts',
tabBarIcon: ({ focused }) => (
<TabBarIcon
focused={focused}
name={Platform.OS === 'ios' ? `ios-link${focused ? '' : '-outline'}` : 'md-link'}
/>
),
};
const ProfileStack = createStackNavigator({
Profile: Profile,
});
ProfileStack.navigationOptions = {
tabBarLabel: 'Profile',
tabBarIcon: ({ focused }) => (
<TabBarIcon
focused={focused}
name={Platform.OS === 'ios' ? `ios-options${focused ? '' : '-outline'}` : 'md-profile'}
/>
),
};
export default createBottomTabNavigator({
HomeStack,
LinksStack,
ProfileStack,
},
{
tabBarOptions: {
showLabel: true,
activeTintColor: '#F8F8F8',
inactiveTintColor: '#586589',
style: {
backgroundColor: '#273746'
},
tabStyle: {}
}
},
);
一次只能将屏幕道具传递到一个屏幕,在第一个屏幕中调用this.props.navigation.navigate('Main',{name: "1"})
,并在 ond componentDidMount(( 调用var p = this.props.navigation.getParam('name'||'No name')
。
您可能希望使用一些库来避免这种情况,例如 Redux 或 https://github.com/vonovak/react-navigation-props-mapper ,甚至是 reactn。