Question

我想将我的反应原生应用中的记录插入Firebase。我的代码如下：

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import * as firebase from 'firebase';

var React = require('react-native');
var {
  Component,
  AppRegistry,
  StyleSheet,
  Text,
  View,
  TouchableHighlight,
  TextInput,
  ListView
} = React;
var Firebase = require('firebase');

export default class App extends React.Component {

  constructor(props) {
    super(props);
    var myFirebaseRef = new Firebase('https://test.firebaseio.com/');

    myFirebaseRef.set({
      title: "Hello World!",
      author: "Simon",
      location: {
        city: "Muenster",
        state: "Germany",
        zip: 48155
      }
    });
  }

  render() {
    return (
      <View style={styles.container}>
        <Text>Open up App.js to start working on your app!</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

AppRegistry.registerComponent('devdacticFirebase', () => devdacticFirebase);

但是，当我启动应用时，该记录未插入我的Firebase。它永远不会抛出任何错误消息。为什么会这样？我错过了哪一部分？

Answer 1

你正在混合es5＆amp; es6代码。由于您已经导入了firebase，因此您无需使用它。

<强>参考

在ES5中，如果使用CommonJS标准，通过基本要求引入React包，代码与此类似：

var ReactNative = require("react-native");

var {Image,Text} = ReactNative;

在ES6中，导入措辞更加标准，类似于：

import { Image, Text} from 'react-native'

最近firebase更新了他们的web SDK，它改变了一些API。您使用的语法类似于2.x API，而latest版本则非常不同

请在加载应用后初始化firebase（推荐使用componentWillMount方法），以便您可以在代码中的任何位置使用它

componentWillMount() {
    var config = {
         "apiKey": "YOUR_API_KEY",
         "authDomain": "YOUR_FB_DOMAIN",
         "databaseURL": "YOUR_FIREBASE_URL",
         "projectId": "YOUR_FB_PROJECT_ID"
    }
    firebase.initializeApp(config);
}

<强>更新

将firebase set放在构造函数中时很奇怪。我想你想在firebase中添加新记录，你可以使用set with push（），这将添加新的记录。假设您在数据库中有用户表，所以：

import {TouchableOpacity} from 'react-native';

export default class App extends React.Component {

  componentWillMount() {
      var config = {
          apiKey: "...",
          authDomain: "...",
          databaseURL: "...",
          projectId: "...",
          storageBucket: "...",
          messagingSenderId: "..."
        };
      firebase.initializeApp(config);
  } 

  constructor(props) {
    super(props);
  }

  insert = () => {
      firebase.database().ref('user').push().set({
          title: "Hello World!",
          author: "Simon",
          location: "Germany",
          city: "Muenster",
          state: "Germany",
          zip: 48155
      }, (error) => {
          if (error) {
             console.log(error.message);
          } else {
             // Success
          }
      });
  }

  render() {
    return (
      <View style={styles.container}>
        <TouchableOpacity onPress={()=> this.insert()}>
             <Text>Hello World!</Text>
        </TouchableOpacity>
      </View>
    );
  }
}

数据未插入Firebase数据库

1 个答案: