Как я могу добавить данные в Firebase Web 9.0.0?

# #javascript #reactjs #firebase #firebase-realtime-database

Вопрос:

Я использовал Firebase более года назад, и я запутался в том, как делать основную работу в новейшей Firebase.

Мой элемент задач, который я хочу добавить в базу данных Firebase, это:

 import React, { useState } from 'react';
import firebase from '../utils/firebase'

export default function Form() {
const [title, setTitle] = useState('')

const handleChange = (e) => {
    setTitle(e.target.value)
}

const createTodo = () => {
    const todoRef = firebase.database().ref('Todo')
    const todo = {
        title,
        complete: false
    };

    todoRef.push(todo)
}

return (
    <div>
        <input type="text" onChange={handleChange} value={title}/>
        <button onClick={createTodo}>Add Todo</button>
    </div>
    )
}
 

Мой firebase.js в utils это:

 import firebase from 'firebase/compat/app';

const firebaseConfig = {
apiKey: "AIzaSyDyfhIiB32tReM7E66wFR8oD0mMC3LKZWM",
authDomain: "nutriapp-b77ee.firebaseapp.com",
projectId: "nutriapp-b77ee",
storageBucket: "nutriapp-b77ee.appspot.com",
messagingSenderId: "717648627918",
appId: "1:717648627918:web:b382565fc790dd1495a89f",
measurementId: "G-W3H2K8NGNJ"
};

firebase.initializeApp(firebaseConfig)

export default firebase;
 

Пожалуйста, помогите, спасибо

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

1. Что работает не так, как задумывалось? Похоже, вы используете совместимые библиотеки и синтаксис пространства имен.

2. Ошибка типа: utils_firebase__WEBPACK_ИМПОРТИРОВАННЫЙ_МОДУЛЬ_1_ .по умолчанию.база данных не является функцией

3. Только что заметил, что вы не импортировали базу данных. Пожалуйста, добавьте это в utils/firebase: import 'firebase/compat/database';

4. Добавлено, ошибка не возникает, но в базе данных нет новой записи

5. Попробуйте добавить это: todoRef.push(todo).then(() -> console.log("data added")).catch((e) => console.log(e))