反应本机导航标题参数

时间:2019-11-07 03:24:16

标签: reactjs react-native react-router react-navigation

我正在尝试将参数传递给React Native Navigation标头标题。通过prop.navigation.setParams({title:'title'})设置参数也尝试过使用this.props。仍然无法正常工作。

最终,我想在页面上的redux状态调用中​​设置标题。

这是我的代码的片段。

const EditScreen = (props) => {

   useEffect(() => {
       props.navigation.setParams({title: 'title'})
   })

return (
       <KeyboardAvoidingView
           enabled={true}
           style={styles.avoidingView}
           keyboardVerticalOffset={90}
           behavior={'padding'}
       >
           <ScrollView style={styles.screen}>
               <View>
                   //CODE OUTPUT HERE
               </View>
           </ScrollView>
       </KeyboardAvoidingView>
   );
};


EditScreen.navigationOptions = navData => {
   return {
       headerTitle: navData.navigation.getParam('title'),
       headerLeft: (
           <HeaderButtons HeaderButtonComponent={CustomHeaderButton}>
               <Item
                   title={'Menu'}
                   iconName={Platform.OS === 'android' ? 'md-menu' : 'ios-menu'}
                   onPress={() => {
                       navData.navigation.toggleDrawer();
                   }}
               />
           </HeaderButtons>
       ),
       headerRight: (
           <View style={styles.avatarContainer}>
               <TouchableOpacity onPress={() => {
                   navData.navigation.navigate({
                       routeName: 'ProfileScreen',
                       params: {
                           userName: 'DummyUser',
                       }})
               }}>
                   <CustomAvatarImage
                       source={require('../../../assets/avatar/avatar.jpg')}
                   />
               </TouchableOpacity>
           </View>
       ),
   }
};

0 个答案:

没有答案