react-navigation传递函数作为自定义标头组件的道具

Question

我在我的本机应用程序中使用了Object reference not set to an instance of an object. Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code. Exception Details: System.NullReferenceException: Object reference not set to an instance of an object. 4。我想将自定义标题组件用于屏幕标题。我的导航器是这样的：

react-navigation

我们可以看到，我需要将const MapTab = createStackNavigator({ MapContainer: { screen: MapContainer, navigationOptions: { header: props => <HeaderMap openDrawer={props.navigation.getParam('openDrawer')} />, }, }, }); 函数传递给我的openDrawer才能在按下屏幕抽屉时打开它。并且在屏幕上，我将<HeaderMap>函数主体设置为openDrawer事件的导航参数。

didMount

我在componentDidMount() { this.props.navigation.setParams({ openDrawer: this.drawer.openDrawer.bind(this) }); } 上称呼它如下：

HeaderMap

但是它没有按预期工作。我总是在按下按钮时收到这样的错误： <TouchableOpacity onPress={() => this.props.openDrawer()}> <Icon name="ios-menu" color={colors.white} size={30} /> </TouchableOpacity> 。我认为在致电Cannot read property 'getParam' of undefined时props.navigation是undefined。

对此案有何见解？ TiA。

Answer 1

我尝试了如下相同的代码：

const MyNavigator = createStackNavigator({


'My Pharmacy': {
    screen: Home,
    navigationOptions: {
      header: props => 
        <HeaderComp value={props} />,
    },

  },

HeaderComp是：

    class HeaderComp extends Component{
      componentDidMount(){
      console.log('header props are: ',this.props)
    }

    render(){
      return(
        null
        )
      }
    }

安慰道具后，我得到了导航对象。

因此，您的道具工作正常，但设置参数时出了点问题。如果从该堆栈外部传递数据，则必须通过screenProps传递数据。否则，如果您在“ MapContainer”屏幕内设置参数，则无需执行此操作，因为标头组件已获取它。尝试一下，如果仍然遇到相同的问题，请添加更多有关问题的详细信息，从何处传递参数以及从何处获得它。