我是新来的React Native,下面引用了一个错误:

对象作为React子对象无效(找到:具有键{$$typeof,type,key,ref,props,_owner,_store}的对象).如果要呈现子对象集合,请改用array.

以下是我在组件文件中包含的全部代码,除了样式:

import React, { Component } from 'react';
import { View, Text, TextInput, TouchableOpacity, Image, StyleSheet } from 'react-native';
import firebase from 'firebase';

class LoginForm extends Component {

    state = { email: '', password: '', error: '', loading: false };

    onButtonPress(){
        const email = this.state.email;
        const password = this.state.password;

        this.setState({error: '', loading: true});

        firebase.auth().signInWithEmailAndPassword(email, password)
            .then(this.onLoginSuccess.bind(this))
            .catch(() => {
                firebase.auth().createUserWithEmailAndPassword(email, password)
                .then(this.onLoginSuccess.bind(this))
                .catch(this.onLoginFail.bind(this));
            });
    }

    onLoginSuccess(){
        this.setState({email: '', password: '', error: '', loading: false});
    }

    onLoginFail(){
        this.setState({error: 'Nie udalo sie utworzyc konta.', loading: false});
    }

    render(){
        return(
            <View style={styles.container}>
                <View style={styles.imageContainer}>
                    <Image 
                        style={styles.image}
                        source={require('../images/loginIcon.png')}
                    />
                </View>
                <View style={styles.formContainer}>
                    <TextInput
                        style={styles.input}
                        placeholder="Email..."
                        placeholderTextColor='rgba(255,255,255,0.9)'
                        underlineColorAndroid='rgba(0,0,0,0)'
                        onChangeText={(email) => this.setState({email: email})}
                        value={this.state.email}
                        autoCorrect={false}
                    />
                    <TextInput
                        style={styles.input}
                        placeholder="Hasło..."
                        placeholderTextColor='rgba(255,255,255,0.9)'
                        underlineColorAndroid='rgba(0,0,0,0)'
                        autoCorrect={false}
                        onChangeText={(password) => this.setState({password: password})}
                        value={this.state.password}
                        secureTextEntry
                    />
                    <TouchableOpacity style={styles.buttonContainer}>
                        <Text style={styles.button}>
                            Zaloguj się
                        </Text>
                    </TouchableOpacity>
                    <Text style={styles.error}>
                        {this.state.error}
                    </Text>
                </View>
            </View>
        );
    }
}

我很困惑如何解决这个问题.提前谢谢.

推荐答案

试试这个:

从应用程序中删除firebase导入语句.js:

import firebase from 'firebase'

在Firebase初始化时,创建一个常量:

initializeFirebase() {
  const firebase = require("firebase");

  // Initialize Firebase
  var config = {
  ...
  };
  firebase.initializeApp(config);

  //inicializando o firestore
  const firestore = require("firebase/firestore");
  db = firebase.firestore();
  db.settings({ timestampsInSnapshots: true });
}

componentWillMount() {
  this.initializeFirebase();
...
}

对我来说,这种变通方法非常有效!

Reactjs相关问答推荐

在react中向数组状态添加值时出错

Reaction路由的问题-在Effect使用API调用响应设置状态之前呈现页面

React 在第一次渲染时为 null

FabricJS反序列化问题

获取 不能显示为 的后代.错误,但不太确定如何构建我的代码以避免此警告

如何在我的自定义主题中样式化MUI TreeItem组件

React Router 6 点击链接在 React 18 应用中打开 flickr 页面

在 CrafterCMS Studio 中拖动字段

当我在 React Router Dom 中使用两个参数并直接在页面上导航时,数据获取没有发生

如何防止开发人员使用 ESLint 在 React 项目中使用特定的钩子?

Next.js i18n 路由不适用于动态路由

使用 axios 响应路由 Dom 操作

React Final Form - 单选按钮在 FieldArray 中不起作用

无法读取未定义的react native 的属性参数

如何从其他组件访问 useQuery refetch 方法?

Storybook - 无法解析generated-stories-entry.cjs/字段browser不包含有效的别名配置

模块解析失败:意外令牌 (257:106) 您可能需要适当的加载程序来处理此文件类型

如何使用 useEffect 和 if 语句 React

NextJs - 如何从站点 map 生成器中删除重复的 URL?

Material UI 安装和 React v. 18.2 出现问题