2017-10-28 60 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');