未定义不是对象(评估this.props.navigation.navigate)

时间:2018-07-23 17:13:30

标签: javascript react-native

我有这样的router.js

import React from 'react';
import { TabNavigator, StackNavigator } from 'react-navigation';

import Login from '../components/login/Login';
import Activation from '../components/login/Activation';
import Phone from '../components/login/Phone';
import ContainerNavs from '../components/navs/ContainerNavs';
import Notification from '../components/navs/notification/Notification';
import Question from '../components/navs/notification/Question';


export const LoginStack = StackNavigator({
  Login: {
    screen: Login,
  },
  Phone: {
    screen: Phone,
  },
  Activation: {
    screen: Activation,
  }
},
{
  headerMode: 'none'
});


export const HomeStack = StackNavigator({
  Home: {
    screen: ContainerNavs,
  },
  Notifications: {
    screen: Notification,
  },
  Question: {
    screen: Question,
  },
},
{
  headerMode: 'none'
});





export const Root = StackNavigator({
  Login: {
    screen: LoginStack,
  },
  Home:{
    screen: HomeStack,
  },
},{
  mode: 'modal',
  headerMode: 'none',
  initialRouteName: 'Login',
}

);

ContainerNavsFooterTab库中的native-base

Notification内部呈现的我的ContainerNavs组件:

 renderSelectedTab () {
     switch (this.state.selectedTab) {
       case 'home':
       return (<Home />);
         break;
       case 'search':
         return (<Text>search</Text>);
         break;
        case 'new':
           return (<New />);
           break;
        case 'notification':
            return (<Notification  />);
            break;
        case 'profile':
         return (<Profile />);
         break;


     }
   }

Notification组件内部,我编写了以下代码:

 goTo(page){
   this.props.navigation.navigate(page);
 }

  render() {
    return (
      <List>
        <ListItem>
        <Card style={{backgroundColor:'#f2f2f6'}}>
        <Button
          onPress={()=>this.goTo('Question')}
        >
          <Text>Toast</Text>
        </Button>

但是当我单击Toast按钮时,出现此错误:

undefined is not an object (evaluation this.props.navigation.navigate)

我认为我应该将导航从ContainerNavs转到Notification

1 个答案:

答案 0 :(得分:0)

解决了这个难题:

return (<Notification navigation={this.props.navigation} />);