javascript - 组件异常错误：文本字符串必须在零件

Question

我收到此错误，不确定这是否是不变违规，因为应用程序没有说明错误在哪里。任何帮助，将不胜感激。

LoinScreen.js

import React, {useState,useContext} from 'react';
import { View, Text, TouchableOpacity, Image, StyleSheet } from 'react-native';
import FormInput from '../components/FormInput';
import FormButton from '../components/FormButton';
import SocialButton from '../components/SocialButton'
import {AuthContext} from '../navigation/AuthProvider';

const LoginScreen  = ({navigation}) => {
    const [email, setEmail] = useState();
    const [password, setPassword] = useState();

const {login} = useContext(AuthContext);


return(
    <View style = {styles.container}>
        <Image
            source={require('../assets/logo.png')}
            style={styles.logo}
        />
        <Text style={styles.text}>FoodDonate</Text>

        <FormInput
            lableValue={email}
            onChangeText={(userEmail) => setEmail(userEmail)}
            placeholderText='Email'
            iconType='user'
            keyboardType='email-address'
            autoCapitalize='none'
            autoCorrect={false}
        />
        <FormInput
            lableValue={password}
            onChangeText={(userPassword) => setPassword(userPassword)}
            placeholderText='Password'
            iconType='lock'
            secureTextEntry={true}
        />
        <FormButton
            buttonTitle="Sign In"
            onPress={() => login(email,password)}
        />
        <TouchableOpacity style={styles.forgotButton} onPress={() => {}}>
            <Text style={styles.navButtonText}>Forgot Password?</Text>
        </TouchableOpacity>
        <SocialButton
            buttonTitle="Sign In with Facebook"
            btnType='facebook'
            color="#4867aa"
            backgroundColor="#e6eaf4"
            onPress={() => {}}
        />
        <SocialButton
            buttonTitle="Sign In with Google"
            btnType='google'
            color="#de4d41"
            backgroundColor="#f5e7ea"
            onPress={() => {}}
        />
        <TouchableOpacity style={styles.forgotButton} onPress={() => navigation.navigate('Signup')}>
            <Text style={styles.navButtonText}>Don't have an Account create here</Text>
        </TouchableOpacity>
    </View>
);
};

export default LoginScreen;

注册屏幕

import React, {useState} from 'react';
import { View, Text, TouchableOpacity, StyleSheet } from 'react-native';
import FormInput from '../components/FormInput';
import FormButton from '../components/FormButton';
import SocialButton from '../components/SocialButton'
import { useContext } from 'react/cjs/react.development';
import { AuthContext } from '../navigation/AuthProvider';

const SignupScreen = ({navigation}) => {
    const [email, setEmail] = useState();
    const [password, setPassword] = useState();
    const [confirmPassword, setconfirmPassword] = useState();

const {register} = useContext(AuthContext)

return(
    <View style = {styles.container}>
        <Text style={styles.text}>Create An Account</Text>

        <FormInput
            lableValue={email}
            onChangeText={(userEmail) => setEmail(userEmail)}
            placeholderText='Email'
            iconType='user'
            keyboardType='email-address'
            autoCapitalize='none'
            autoCorrect={false}
        />

        <FormInput
            lableValue={password}
            onChangeText={(userPassword) => setPassword(userPassword)}
            placeholderText='Password'
            iconType='lock'
            secureTextEntry={true}
        />
        <FormInput
            lableValue={confirmPassword}
            onChangeText={(userPassword) => setconfirmPassword(userPassword)}
            placeholderText='Confirm Password'
            iconType='lock'
            secureTextEntry={true}
        />

        <FormButton
            buttonTitle="Sign Up"
            onPress={() => register(email,password)}
        />

        <View style={styles.textPrivate}>
            <Text style={styles.color_textPrivate}>
                By registering, you confirm that you accept our
            </Text>
            <TouchableOpacity onPress={() => alert('Terms Clicked!')}>
                <Text style={[styles.color_textPrivate, {color: '#e88832'}]}>
                    Terms of service
                </Text>
            </TouchableOpacity>
            <Text style={styles.color_textPrivate}> and </Text>
            <Text style={[styles.color_textPrivate, {color: '#e88832'}]}>
                Privacy Policy
            </Text>
        </View>

        <SocialButton
            buttonTitle="Sign Up with Facebook"
            btnType='facebook'
            color="#4867aa"
            backgroundColor="#e6eaf4"
            onPress={() => {}}
        />

        <SocialButton
            buttonTitle="Sign Up with Google"
            btnType='google'
            color="#de4d41"
            backgroundColor="#f5e7ea"
            onPress={() => {}}
        />

        <TouchableOpacity style={styles.navButton} onPress={() => navigation.navigate('Login')}>
            <Text style={styles.navButtonText}>Have an Account? SignIn</Text>
        </TouchableOpacity>
    </View>
);
};

export default SignupScreen;

AuthProvider.js

import React, {createContext, useState} from 'react';
import auth from '@react-native-firebase/auth';

export const AuthContext = createContext();

export const AuthProvider = ({children}) => {
    const [user, setUser] = useState(null);

return(
    <AuthContext.Provider
        value={{
            user,
            setUser,
            login: async (email, password) => {
                try {
                    await auth().signInWithEmailAndPassword(email, password);
                } catch (e) {
                    console.log(e);
                }
            },
            register: async (email, password) => {
                try {
                    await auth().createUserWithEmailAndPassword(email, password)
                } catch (e) {
                    console.log(e);
                }
            },
            logout: async () => {
                try {
                    await auth().signOut();
                } catch (e) {
                    console.log(e);
                }
            },
        }}> {children}
    </AuthContext.Provider>
);
};

路由.js

import React, {useContext, useState, useEffect} from 'react';
import {NavigationContainer} from '@react-navigation/native';
import auth from '@react-native-firebase/auth';
import {AuthContext} from './AuthProvider';

import AuthStack from './AuthStack';
import AppStack from './AppStack';


const Routes = () => {

const {user, setUser} = useContext(AuthContext);
const [initializing, setInitializing] = useState(true);


const onAuthStateChanged = (user) => {
    setUser(user);
    if (initializing) setInitializing(false);
};

useEffect(() => {
    const subscriber = auth().onAuthStateChanged(onAuthStateChanged);
    return subscriber; // unsubscribe on unmount
}, []);

if (initializing) return null;


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

}

导出默认路由；

应用程序.js

import React from 'react';
import Providers from './navigation';


const App = () => {
  return <Providers />;
}

export default App;

我已经彻底检查了我的代码，没有发现任何错位的文本。我不确定这是否是不变违规，但请纠正我。

标签： javascriptreactjsreact-native