reactJS中的Firebase初始化问题

问题描述

我正在尝试在应用程序组件中使用Firebase。这就是该组件的代码(在此处发布时,从json删除了api的详细信息)。

import numpy as np
from pyside2 import QtWidgets,QtCore
from matplotlib.backends.backend_qt5agg import figureCanvasQTAgg
from matplotlib.figure import figure
import matplotlib
matplotlib.use('Qt5Agg')


class MyChart(QtWidgets.QMainWindow):
    def __init__(self):
        super().__init__()

        canvas1 = figureCanvasQTAgg(figure(figsize=(20,12))) 
        ax1 = canvas1.figure.add_subplot(111)
        ax1.plot(np.sin(np.linspace(0,4,1000)))
        ax1.set_title('Chart 1')

        canvas2 = figureCanvasQTAgg(figure(figsize=(20,12))) 
        ax2 = canvas2.figure.add_subplot(111)
        ax2.plot(np.sin(5 * np.linspace(0,1000)))
        ax2.set_title('Chart 2')
        
        splitter = QtWidgets.QSplitter(QtCore.Qt.Vertical)
        splitter.addWidget(canvas1)
        splitter.addWidget(canvas2)
        self.setCentralWidget(splitter)
        self.show()

if __name__ == '__main__':
    app = QtWidgets.QApplication([])
    w = MyChart()
    app.exec_()

问题是,当我插入那个firebaseInitializeApp函数(现在已经存在)时,它会给出错误

import React from "react";
import * as firebase from "firebase";

const New_meet =() =>{
    
    var firebaseConfig={
        apiKey:,authDomain:,databaseURL:,projectId:,storageBucket:,messagingSenderId:,appId:,measurementId: 
    };
    
    console.log("here");
    firebase.initializeApp(firebaseConfig);
    
    const preObject = document.getElementById('object');
    const dbRefObject = firebase.database().ref().child('object');
    dbRefObject.on('value',snap=>console.log(snap.val()));
    
    return(
        <div>
            <p id="object"></p>
        </div>
    );
}

export default New_meet;

当我删除该行时,它显示

"Firebase: Firebase App named '[DEFAULT]' already exists (app/duplicate-app)."

我没有在App.js或任何其他组件中导入Firebase。以前从未使用过Firebase,所以不知道如何解决此问题。

解决方法

似乎每次模块重新加载时您都在使用Firebase应用的新实例。

您必须初始化一次Firebase,然后在整个应用中使用实例。

创建一个新文件,您可以在其中初始化firebase并在整个应用程序中使用它。

firebase.js

import firebase from 'firebase';

try {
   firebase.initializeConfig({ /* Config here* /})
} catch(err) {
   // swallow the error
   console.log(err)
}

/* use this firebase in your project. */
export default firebase;