2017-10-28 59 views
0

问题反应本地/火力地堡错误的应用程序尚未创建

我创建一个简单的应用程序,人们可以创建使用帖子反应本土火力,当我说所有的代码上传一个变量“postInput”到服务器,我得到了一个错误(图片包括)说该应用程序尚未创建,它告诉我打电话App.initializeApp(),但我确实有我的应用程序中的代码。我很想解决这个问题。

代码

import React, { Component } from 'react'; 
import { StyleSheet, Text, View, Image, TextInput, ScrollView, TouchableHighlight, Button } from 'react-native'; 
import { Font } from 'expo'; 
import * as firebase from 'firebase'; 

var fontLoaded = false; 

var ref = firebase.database().ref('posts'); 

var newPostRef = ref.child("posts"); 

var newPostRef = postsRef.push(); 

const firebaseConfig = { 
    apiKey: "AIzaSyD025SWUH7zLELn4vWtf9nGq1-0h33Y958", 
    authDomain: "candidtwo.firebaseapp.com", 
    databaseURL: "https://candidtwo.firebaseio.com", 
    storageBucket: "candidtwo.appspot.com", 
}; 
const firebaseApp = App.initializeApp(firebaseConfig); //tells me to call this, I do and still get error 

export default class App extends React.Component { 

    state = { 
    fontLoaded: false, 
    }; 



    componentDidMount() { 
     Expo.Font.loadAsync({ 
     'JosefinSans-Regular.ttf': require('./JosefinSans-Regular.ttf'), 
     }); 
} 
    constructor(props) { 
    super(props); 
    this.state = { postInput: ""} 
    } 

render() { 
    return (
     <View style={styles.container}> 
     <View style={styles.button}> 
      <View style={{width: 1, height: 30, backgroundColor: '#e8e8e8'}} /> 
      <Button 
      onPress={() => this.setState({ fontLoaded: true })} 
      title="Press Me To Load the App After 15 Seconds!" 
      color="#fe8200" 
      accessibilityLabel="Wait 15 seconds and then press me to load the font!" 
      /> 
     </View> 


     {this.state.fontLoaded ? (
      <View style={styles.container}> 
      <Text style={{ fontFamily: 'JosefinSans-Regular', fontSize: 16 }}> 
       Whats on your mind? Create a post! 
      </Text> 

      <TextInput 
       style={{height:40, width: 320, borderColor: '#303030', borderWidth: 1}} 
       onChangeText={(postInput)=>this.setState({postInput})} 
       value={this.state.postInput}  
      /> 


    <Button 
     onPress={() => { 
     newPostRef.set({ content:this.state.postInput }); 
     this.setState({ postInput: "Your post was succsesfully uploaded! :)" })  
     }}    
     title="        +        " 
     color="#fe8200" 
    /> 

var path = newPostRef.toString(); 

      <ScrollView> 
       <View style={{width: 1, height: 6, backgroundColor: '#e8e8e8'}} /> 
       <View style={{width: 350, height: 250, backgroundColor: '#1daff1', alignItems: 'center', justifyContent: 'center', borderRadius: 10, paddingLeft: 10, paddingRight:10}} > 
     <Text style={{ fontFamily: 'JosefinSans-Regular', fontSize: 18, color: '#ffffff', textAlign: 'center'}}> 
        Why do android phones have higher inital quality than apple phones, but apple phones have a more consistent amount of quality throughout their years? 
       </Text> 
      </View> 
       <View style={{width: 350, height: 40, borderRadius: 10, backgroundColor: '#147aa8', flexDirection: 'row',paddingLeft:5}} > 
      <Image source={require('./CandidtwoImages/unlove.png')} /> 
      <Text style={{ fontFamily: 'JosefinSans-Regular', fontSize: 18, color: '#ffffff'}}> 
        3 
        </Text> 
      <Image source={require('./CandidtwoImages/undislike.png')} /> 
      <Text style={{ fontFamily: 'JosefinSans-Regular', fontSize: 18, color: '#ffffff'}}> 
        1 
        </Text> 
      <Image source={require('./CandidtwoImages/comments.png')} /> 
      <Text style={{ fontFamily: 'JosefinSans-Regular', fontSize: 18, color: '#ffffff'}}> 
        8 
        </Text> 
     </View> 
       <View style={{width: 1, height: 6, backgroundColor: '#e8e8e8'}} /> 
       <View style={{width: 35, height: 25, backgroundColor: '#147c41', borderRadius: 10}} /> 
       <View style={{width: 35, height: 4, backgroundColor: '#0f582d', borderRadius: 10}} /> 
       <View style={{width: 1, height: 6, backgroundColor: '#e8e8e8'}} /> 
      <View style={{width: 1, height: 6, backgroundColor: '#e8e8e8'}} /> 
       <View style={{width: 35, height: 25, backgroundColor: '#9dcd46', borderRadius: 10}} /> 
       <View style={{width: 35, height: 4, backgroundColor: '#6c8f31', borderRadius: 10}} /> 
       <View style={{width: 1, height: 6, backgroundColor: '#e8e8e8'}} /> 
      <View style={{width: 1, height: 6, backgroundColor: '#e8e8e8'}} /> 
       <View style={{width: 35, height: 25, backgroundColor: '#d3832e', borderRadius: 10}} /> 
       <View style={{width: 35, height: 4, backgroundColor: '#935b1e', borderRadius: 10}} /> 
       <View style={{width: 1, height: 6, backgroundColor: '#e8e8e8'}} /> 

      </ScrollView> 
      </View>) : (null) } 
     </View> 
    ); 
    } 
} 

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

错误消息 Error Message

回答

0

你应该调用此初始化你的应用程序。

const firebaseApp = firebase.initializeApp(firebaseConfig); 
0

所以,在这条线的位置:

var ref = firebase.database().ref('posts'); 

您正在尝试当你的火力应用尚未初始化分配给您的火力数据库的引用。

这里:

const firebaseApp = App.initializeApp(firebaseConfig); 

您正在尝试初始化火力应用程序调用从App类的initializeApp()方法,该方法属于那你上面所做的火力进口,而你不知道不需要初始化您的Firebase App将其分配给一个变量。

你可以做的是这样的:

删除在其中创建行的变量ref;

初始化您的火力应用程序是这样的:

firebase.initializeApp(config); 

然后你就可以创建变量ref;

var ref = firebase.database().ref('posts');