метод firebase.on выдает ошибку, не связанную с функцией

#reactjs #firebase #firebase-realtime-database

#reactjs #firebase #firebase-realtime-database

Вопрос:

Это ошибка, которую я получаю Uncaught TypeError: _config_fire__WEBPACK_IMPORTED_MODULE_2__.default.on is not a function

Другие мои функции firebase, обычно firebase auth, выполняются нормально (не в этом файле). Я импортирую это неправильно или что-то еще? Вот как я это называю:

 /* eslint-disable react/no-unused-state */
/* eslint-disable new-cap */
/* eslint-disable class-methods-use-this */
import React, { Component } from 'react';
import { Map } from 'immutable';
import fbase from '../config/fire';
import Entry from './leaderboard_entry';

class Leaderboard extends Component {
  constructor(props) {
    super(props);

    this.state = {
      users: Map(),
    };
  }

  initialize() {
    fbase.on('value', (snapshot) => {
      const newUserState = snapshot.val();
      this.setState({ users: Map(newUserState) });
    }, (error) => {
      console.error(error);
    });
  }
  

и вот конфигурация, если она вам нужна

 import firebase from 'firebase';

const firebaseConfig = {
  apiKey: 
  authDomain: 
  databaseURL:
  projectId: 
  storageBucket: 
  messagingSenderId:
  appId: 
};

const fbase = firebase.initializeApp(firebaseConfig);

export default fbase;
  

Подробности отредактированы.

Ответ №1:

Ошибка верна, вы пытаетесь выполнить on, что неверно для ссылок в приложении firebase. Обновите свой код, чтобы получить доступ к базе данных и получить ссылку на путь к вашим данным, затем вы можете подключить значение on:

 fbase.database().ref('/some-path').on('value', (snapshot) => {
  const newUserState = snapshot.val();
  this.setState({ users: Map(newUserState) });
}, (error) => {
  console.error(error);
});
  

Также вам нужно будет выполнить статический импорт для любых используемых вами модулей:

 import 'firebase/auth';
import 'firebase/database';
  

Надеюсь, это поможет!

Комментарии:

1. Спасибо за ответ! Итак, мне нужно добавить инструкции import в мою конфигурацию и указать базу данных в моих вызовах fbase, верно?

2. Да, импортируйте модули, которые вы используете в качестве статического импорта, и вызовите database() вместе с ссылкой на существующий путь к данным.

Ответ №2:

Вам нужно импортировать пакет firebase / firestore.

Ваш код должен быть таким, как показано ниже.

 import firebase from 'firebase';
import 'firebase/firestore';

const firebaseConfig = {
  apiKey: 
  authDomain: 
  databaseURL:
  projectId: 
  storageBucket: 
  messagingSenderId:
  appId: 
};

const fbase = firebase.initializeApp(firebaseConfig);

export default fbase;