如何将道具传递给React堆栈导航器

时间:2018-01-23 12:05:49

标签: react-native react-native-android react-navigation stack-navigator react-props

我正在以下列方式进行导航Home.js - > discover-things.js(包括顶部导航栏) - >过滤screen.js

在Home.js中,我有一个像这样定义的堆栈导航器---

this.router.navigateByUrl('errorPage');
resolve(false);

在顶部导航栏中,我有这个---

import { StackNavigator } from 'react-navigation'; 
import DiscoverScreen from './discover-things';
import TopNavBar from './discover-things/top-nav-bar';

export default StackNavigator({
  DiscoverScreen: {
    screen: DiscoverScreen,
    navigationOptions: { header: TopNavBar },
  },
});

这里我在其中一个图标上应用OnClick,以便它可以引导我进入过滤器屏幕。

在筛选屏幕中,我有这个----

import React from 'react';
import {Alert} from 'react-native';

export default ({...props}) => (   //Here the props are undefined
  <View style={styles.navbarContainer}>
    <View style={[styles.titleContainer, globalStyles.verticallyBottom]}>
      <Text style={styles.discoverTitle}>
                Discover
      </Text>
    </View>
    <View style={[styles.toolsContainer, globalStyles.verticallyBottom]}>
      <View style={[styles.toolsInnerContainer, globalStyles.verticallyBottom]}>
        <Icon name="search" size={25} style={styles.icon} />
        <Icon name="sliders" size={25} style={styles.icon} onPress={() => {props.navigation.navigate('FilterScreen')}
/>
      </View>
    </View>
  </View>
);

但是点击过滤器屏幕中的图标,没有任何反应。我在这里做错了什么以及如何正确实施它?

0 个答案:

没有答案