对象作为React子对象无效（找到：带有键{auth，user}的对象）：React Native

Question

我是React Native和Firebase的新手。我尝试使用带有Firebase的电子邮件和密码进行基本的登录和注册，以了解其工作原理。我的应用程序流程是，当用户通过身份验证时，它将使用AppStack.js，否则将使用AuthStack.js，并且在成功登录后，它将导航到HomeScreen，并且在注册时将执行相同的操作。当我尝试导航到HomeScreen时出现错误。有人可以给我一个解决方案并解释一下为什么我遇到这种错误的原因吗？非常感谢

错误：对象作为React子对象无效（发现：键为{auth，user}的对象）。如果要渲染子级集合，请改用数组

这是我的App.js

const App = () => {
  const [user, setUser] = useState(null);

  const onStateAuthChanged = user => {
    setUser(user);
  }

  useEffect(() => {
    const subscriber = auth().onAuthStateChanged(onStateAuthChanged);

    return subscriber;
  }, [])

  return (
    <NavigationContainer>
      {user ? <AppStack /> : <AuthStack />}
    </NavigationContainer>
  );
}

export default App;

这是我的AppStack.js

const AppStack = () => {
    return (
        <Stack.Navigator initialRouteName="HomeScreen">
            <Stack.Screen name="HomeScreen" component={HomeScreen} />
            <Stack.Screen name="AboutScreen" component={AboutScreen} />
            <Stack.Screen name="ProfileScreen" component={ProfileScreen} />
        </Stack.Navigator>
    );
}

export default AppStack;

这是我的AuthStack.js

const AuthStack = () => {
    return (
        <Stack.Navigator
            initialRouteName="SignInScreen"
        >
            <Stack.Screen name="SignInScreen" component={SignInScreen} />
            <Stack.Screen name="SignUpScreen" component={SignUpScreen} />
        </Stack.Navigator>
    );
}

这是我的SignInScreen

const SignInScreen = () => {
    const [email, setEmail] = useState('');
    const [password, setPassword] = useState('');

    const navigation = useNavigation();
    return (
        <View style={styles.container}>
            <View style={styles.header}>
                <View style={styles.textInput}>
                    <TextInput placeholder="Your email" style={styles.input} onChangeText={text => setEmail(text)} />
                    <TextInput placeholder="Your password" style={[styles.input, { marginTop: 15 }]} onChangeText={text => setPassword(text)} />
                </View>
                <TouchableOpacity
                    style={styles.button}
                    onPress={() => {
                        auth().signInWithEmailAndPassword(email, password)
                            .then(() => navigation.navigate('HomeScreen'))
                            .catch(err => console.log(err));
                    }}
                >
                    <Text>LOGIN</Text>
                </TouchableOpacity>
            </View>
            <View style={styles.footer}>
                <TouchableOpacity onPress={() => navigation.navigate("SignUpScreen")}>
                    <Text>Don't have account ? Signup now</Text>
                </TouchableOpacity>
            </View>
        </View>
    );
}

这是我的SignUpScreen

const SignUpScreen = () => {
    const [email, setEmail] = useState('');
    const [password, setPassword] = useState('');
    const navigation = useNavigation();

    const handleEmailChange = value => {
        setEmail(value);
    }

    const handlePasswordChange = value => {
        setPassword(value);
    }

    const handleSubmitForm = () => {
        auth().createUserWithEmailAndPassword(email, password)
            .then(() => console.log('dang ky thang cong'))
            .catch(err => console.log(err));
    }

    return (
        <View style={styles.container}>
            <View style={styles.header}>
                <View style={styles.textInput}>
                    <TextInput
                        placeholder="Your email"
                        style={styles.input}
                        value={email}
                        onChangeText={(text) => handleEmailChange(text)}
                    />
                    <TextInput
                        placeholder="Your password"
                        style={[styles.input, { marginTop: 15 }]}
                        value={password}
                        onChangeText={(text) => handlePasswordChange(text)}
                    />
                </View>
                <TouchableOpacity style={styles.button} onPress={() => handleSubmitForm()}>
                    <Text>Signup</Text>
                </TouchableOpacity>
            </View>
        </View>
    );
}

这是我的HomeScreen.js

const HomeScreen = () => {
    const [user, setUser] = useState('');

    useEffect(() => {
        const currentUser = auth().currentUser;
        setUser(currentUser);
    }, [])
    return (
        <View style={styles.container}>
            <Text>You logged in as {user}</Text>
        </View>