在React导航的另一个屏幕中获取道具,可以通过以下步骤实现:
下面是一个示例代码:
// 导航配置文件
import { createStackNavigator } from 'react-navigation';
import ItemScreen from './ItemScreen';
const AppNavigator = createStackNavigator({
Home: { screen: HomeScreen },
Item: {
screen: ItemScreen,
navigationOptions: ({ navigation }) => ({
title: navigation.getParam('item').name // 设置标题为道具名称
})
},
});
export default createAppContainer(AppNavigator);
// ItemScreen组件
import React from 'react';
import { View, Text } from 'react-native';
class ItemScreen extends React.Component {
render() {
const item = this.props.navigation.getParam('item');
return (
<View>
<Text>{item.name}</Text>
<Text>{item.description}</Text>
</View>
);
}
}
export default ItemScreen;
在上面的示例中,我们通过导航配置文件中的"navigationOptions"属性设置了"ItemScreen"的标题为道具的名称。在"ItemScreen"组件中,我们使用props.navigation.getParam('item')获取传递的道具信息,并在render方法中展示道具的名称和描述。
这样,当你从其他屏幕导航到"ItemScreen"时,你就可以在该屏幕中获取到传递的道具信息了。
腾讯云相关产品和产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云