错误 Cloud Firestore addEventListener 不是函数#react-native #firestore

Question

我在使用 Cloud Firestore 时遇到问题和错误 当我输入 var db = firebaseApp.firestore () 时出现该错误

Image depicting errors

import React, { Component } from 'react'
import { StyleSheet, View, Dimensions, Image, Text, SafeAreaView, 
ScrollView, FlatList, Modal, TextInput, TouchableOpacity } from 'react- 
native';
import { firebaseAppKeep } from '../../constant/configFireBase'


import FontAwesome5 from 'react-native-vector-icons/FontAwesome5'


import TaskList from '../../components/TaskList'
import TaskForm from '../../components/TaskForm'
import HeaderBar from '../../components/HeaderBar'

const WIDTH = Dimensions.get('window').width
const HEIGHT = Dimensions.get('window').height
const sizeIconAdd = 60

export default class TaskHome extends Component {
  constructor(props) {
super(props);
this.state = {
  statusModal: false,
  taskList: []
}
      }
  OpenModalTaskControl = () => {
    this.setState({
      statusModal: !this.state.statusModal
    })
  }
  getDayCreated = () => {
var date = new Date().getDate(); //Current Date
var month = new Date().getMonth() + 1; //Current Month
var year = new Date().getFullYear(); //Current Year
date = date + '/' + month + '/' + year
return date
  }
  getTimeCreate = () => {
var hours = new Date().getHours(); //Current Hours
var min = new Date().getMinutes(); //Current Minutes
var sec = new Date().getSeconds(); //Current Seconds
hours = hours + ':' + min + ':' + sec
return hours
  }
      s4() {
    return Math.floor((1 + Math.random()) *     0x10000).toString(16).substring(1)
  }
  genarateID() {
    return this.s4() + this.s4() + '-' + this.s4() + this.s4() + '-' +             this.s4() + this.s4() + '-' + this.s4() + this.s4();
  }

  addTask = (task) => {
task.id = this.genarateID()
task.dayCreated = this.getDayCreated()
task.timeCreated = this.getTimeCreate()
console.log(task)

var user = firebaseAppKeep.auth().currentUser
var db = firebaseAppKeep.firestore()
if (user) {
  console.log(user.email, user.uid)
  db.collection(user.uid)
    .add({
      colorTask: task.colorTask,
      dayCreated: task.dayCreated,
      id: task.id,
      status: task.status,
      taskDetail: task.taskDetail,
      timeCreated: task.timeCreated,
      titleTask: task.titleTask
    })
    }
    this.state.taskList.push(task)
      }
  SignOut = () => {
    firebaseAppKeep.auth().signOut()
  .then(() => {
    this.props.navigation.navigate('AuthRoutes')
  })
  .catch(error => console.log(error));
  }
  render() {
    var { statusModal } = this.state
    var showBtnAddTask = statusModal === false ?
      <View style={{ position: 'absolute', left: WIDTH - sizeIconAdd - 10, vtop: HEIGHT - sizeIconAdd - 20 }}>
    <TouchableOpacity onPress={() => this.OpenModalTaskControl()}>
      <FontAwesome5 name={"plus"} size={sizeIconAdd} color={"black"} />
    </TouchableOpacity>
  </View>
  : null
return (
  <SafeAreaView>
    <HeaderBar opacity={this.state.statusModal} signout={this.SignOut} />

    <View style={{ marginHorizontal: 10, alignItems: 'center', opacity: this.state.statusModal === true ? 0.1 : 1 }}>
      <TaskList taskList={this.state.taskList} />
    </View>

    <TaskForm
      statusModal={this.state.statusModal}
      changeStatusModal={this.OpenModalTaskControl}
      addTask={this.addTask}
    />
    {showBtnAddTask}
  </SafeAreaView>
);
}
}

error { TypeError :e.addEventListener 不是函数。 （在 'e.addEventListener("visibilitychange",this.ah)','e.addEventListener ' 未定义）}

希望对你有所帮助

Answer 1

多次尝试后，当我添加此行时它可以工作：

window.addEventListener = (x) => x;

在导入和声明 firebase 之前，同样如此：

firebase.js

window.addEventListener = (x) => x;

import * as firebase from "firebase";

const firebaseConfig = {
apiKey: "myAPIkEy",
authDomain: "myapp.firebaseapp.com",
databaseURL: "https://myapp.firebaseio.com",
projectId: "myapp",
storageBucket: "myapp.appspot.com",
messagingSenderId: "00000000",
appId: "1:000000000:web:0000000000459",
measurementId: "G-TOOOOOOOO",
};

firebase.initializeApp(firebaseConfig);

Answer 2

这是由于firebase-js 在窗口上使用了事件侦听器，RN 中不存在该事件侦听器。通过在应用程序的顶层插入这一行来模拟它。

window.addEventListener = x => x;

Answer 3

有同样的问题。我让它工作的唯一方法就是下降到 "firebase": "^6.6.2"

Answer 4

我正在使用世博会。我通过运行expo install firebase 修复了它。它安装了 7.9.0 版，现在警告消失了。

Answer 5

我通过执行以下步骤找到了解决方案： 1. 7.14.0版本重装Firebase 2.我安装了base-64 3.将以下代码添加到我的app.js中

 import {decode, encode} from 'base-64'

 if (! global.btoa) {global.btoa = encode}

 if (! global.atob) {global.atob = decode}

它奏效了，但对我来说仍然像是一些警告。

请通过添加 firebase 和 firebase-firestore 来编辑问题标签，以便 firebase 团队查看问题。