路由 'login' 的组件必须是 REACT 组件

Question

我希望你们都做得很好。我看到了许多与此相关的答案，并在代码中实现了许多答案，但似乎什么都不起作用。我一直收到这个烦人的错误。原因可能是什么？我使用react原生路由器流量进行路由和expo项目。

Login.js

import React from "react";
import { StyleSheet, Text, View, TouchableOpacity } from "react-native";
import { Actions } from "react-native-router-flux";
import Logo from "../components/Logo";
class Login extends React.Component {
signup() {
Actions.signup();
}
render() {
return (
<View style={styles.container}>
<Logo />
<form type="Login" />
<View style={styles.signupTextCont}>
<Text style={styles.signupText}>
You don't have an account yet ?{" "}
</Text>
<TouchableOpacity onPress={this.signup}>
<Text style={styles.signupButton}>Signup</Text>
</TouchableOpacity>
</View>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fbc02d",
alignItems: "center",
justifyContent: "center",
},
signupTextCont: {
flex: 1,
alignItems: "flex-end",
justifyContent: "center",
paddingVertical: 16,
flexDirection: "row",
},
signupText: {
color: "rgba(255,255,255,0.7)",
fontSize: 16,
},
signupButton: {
color: "#ffffff",
fontSize: 16,
fontWeight: "500",
},
});
export default Login;

Routes.js

import React from "react";
import { Stack, Router, Scene } from "react-native-router-flux";
import Login from "./Login";
import Signup from "./Signup";
class Routes extends React.Component {
render() {
return (
<Router>
<Stack key="root" hideNavBar={true}>
<Scene key="login" Component={Login} title="Login" />
<Scene key="signup" Component={Signup} title="Signup" />
</Stack>
</Router>
);
}
}
export default { Routes };

请尽快在这方面提供帮助，因为我需要提交它：(

Answer 1

您的代码中有一个小的拼写错误，它是component而不是Component。

<Router>
<Stack key="root" hideNavBar={true}>
<Scene key="login" component={Login} title="Login" />
<Scene key="signup" component={Signup} title="Signup" />
</Stack>
</Router>