Question

环境

本机反应：0.61

本机导航：4.0

已部署的操作系统：Android 9操作系统

import {createAppContainer} from 'react-navigation';
import {createStackNavigator} from 'react-navigation-stack';
import Signup from './Signup';
import React, { Component } from 'react';
import Home from './Home';
import EditProfile from './Editprofile';
import Payments from './Payments';
import Refer from './Refer';
import { createDrawerNavigator } from 'react-navigation-drawer';

export default class App extends React.Component {
  render() {

    return <Appcont />;
  }
}
const appi = createStackNavigator(
  {
    signup: {
      screen: ()=><Signup/>
    },
     home: {
        screen: ()=><Home/>
      },
      editProfile:{
        screen:()=><EditProfile/>
      },
      payments:{
        screen:()=><Payments/>
      },
      refer:{
        screen:()=><Refer/>
      }
    },
    {
      initialRouteName:'signup'
    }

);


const MyDrawerNavigator = createDrawerNavigator(appi,{
  initialRouteName: 'signup',
    headerMode:'float',
  contentOptions: {
    activeTintColor: '#e91e63',
  }
});

const Appcont = createAppContainer(MyDrawerNavigator);

home.js

import React, { Component } from 'react';
import { Text, View,Image } from 'react-native';


 class Home extends Component {
  static navigationOptions = {
    title:'Home',
  drawerLabel: 'Home',
  drawerIcon: ({ tintColor }) => (
    <Image
      source={require('./img/Homepng.png')}
      style={{width:20,height:20}}
    />
  ),headerShown:'true'
};
  render() {

    return (
      <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
        <Text>Hello, home</Text>
      </View>
    );
  }
}
export default Home;

当我运行上面的代码时，它抛出一个错误！错误路由器组件必须是反应组件

我已经看到了与此相关的所有问题，并已尽力纠正，但是仍然出现此错误，我不知道为什么？

Answer 1

您可以尝试更改

const appi = createStackNavigator(
  {
    signup: {
      screen: ()=><Signup/>
    },
}

到

const appi = createStackNavigator({
  signup: {
    screen: Signup,
  },
});

同时，Singup必须扩展React.Component，并记住将其导出。并且() => <Home/>不是组件。它是函数对象

export defalut class Sigup extends React.component

错误路由器组件必须是React组件

1 个答案: