Question

我正在尝试将所有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: {}
  }
},


);

Answer 1

您一次只能将screenprops传递到一个屏幕，在第一个屏幕中调用makemigrations，然后再调用@objc func toggleButton(_ sender: UIButton) { //Play if sender.image(for: .normal) == UIImage(named: "play") { profileImage.layer.borderColor = UIColor(hexString: "#8e8e8e").cgColor profileImage.layer.shadowColor = UIColor(hexString: "#099d57").cgColor profileImage.layer.cornerRadius = profileImage.frame.width / 2 profileImage.layer.shadowOpacity = 1 profileImage.layer.shadowOffset = CGSize.zero profileImage.layer.shadowRadius = 10 profileImage.layer.shouldRasterize = true profileImage.layer.masksToBounds = false } else { //Pause profileImage.layer.borderColor = UIColor(hexString: "#434343").cgColor profileImage.layer.shadowColor = UIColor(hexString: "#df544a").cgColor profileImage.layer.cornerRadius = profileImage.frame.width / 2 profileImage.layer.shadowOpacity = 1 profileImage.layer.shadowOffset = CGSize.zero profileImage.layer.shadowRadius = 10 profileImage.layer.shouldRasterize = true profileImage.layer.masksToBounds = false } }并调用componentDidMount（）。

您可能想使用某些库来避免这种情况，例如Redux或https://github.com/vonovak/react-navigation-props-mapper，甚至是reactn。

使用堆栈导航器博览会时如何传递Screen道具

1 个答案: