reactjs - 如何将 React 表单数据添加到 Firebase 实时数据库？

Question

我是 ReactJS 的新手。我正在使用 fireadmin 动态管理面板 购买的版本，在此面板中我创建了一个包含表单的页面。现在我想将该表单值保存到我的 firebase 数据库中。此管理面板具有添加功能使用架构文件的数据。但我想从前端添加数据。我已按照教程 video tutorial 进行操作。如果您有任何指导，请告诉我。它还会给我错误 firebase is not function。

我的功能

 import Config from   '../config/app';    
 import DbConfig from   '../config/database';
    handleChange(event) {
        this.setState({value: event.target.value});
    }


addMessage(e){
    e.preventDefault(); // <- prevent form submit from reloading the page
    /* Send the message to Firebase */
   DbConfig.database().ref('billing').push(this.inputEl.value,this.inputEm.value);

    this.inputEl.value = ''; // <- clear the input
    this.inputEm.value = ''; 
  }

          render() {
        return (
                <div className="content">
                <NavBar></NavBar>
          <div className="row">
            <div className="col-md-10">
                <div className="card">
                    <form onSubmit={this.addMessage.bind(this)}>
      <input type="text" ref={ el => this.inputEl = el }/>
      <input type="text" ref={ em => this.inputEm = em }/>
      <input type="submit"/>

    </form>
            </div>

          </div>
                </div>
        )
      }

数据库.js

 import * as firebase from 'firebase';
require("firebase/firestore");
import Config from './app';

var FbApp = firebase.initializeApp(Config.firebaseConfig);
module.exports = FbApp; //this doesnt have to be database only

app.js

  //FireBase
     exports.firebaseConfig = {
         apiKey: "AIzaSyDsPufr5Dhusqal0bB8VDD9N6yv9u0Lo1E",
         authDomain: "tester-8e38d.firebaseapp.com",
         databaseURL: "https://tester-8e38d.firebaseio.com",
         projectId: "tester-8e38d",
         storageBucket: "tester-8e38d.appspot.com",
         messagingSenderId: "490493205074"
     };

Answer 1

最后我找到了解决方案，这就是我为解决问题所做的事情。感谢@Josh Pittman 的指导，没有它我就无法让它发挥作用。

  import Config from   '../config/app';
    import DbConfig from   '../config/database';  
     addMessage(e){
            e.preventDefault(); // <- prevent form submit from reloading the page
            /* Send the message to Firebase */
            var userInfo = {
                billing_name : this.pnm.value,
                billing_flat : this.fno.value,
              }; //user info
            DbConfig.database().ref('billing').push(userInfo);

            this.pnm.value = ''; // <- clear the input
            this.fno.value = ''; 
          }
     render() {
        return (
                <div className="content">
                <NavBar></NavBar>
          <div className="row">
            <div className="col-md-12">
                <form onSubmit={this.addMessage.bind(this)}>
              <input type="text" ref={ el => this.inputEl = el }/>
              <input type="text" ref={ em => this.inputEm = em }/>
              <input type="submit"/>

            </form>
            </div>

          </div>
    </div>
        )
      }