2017-12-29 4 views
0

새로운 ReactJS &에 중포 기지 내 중포 기지의 DB에 양식을 게시하려고하지만, 메신저는 다음과 같은 오류 메시지도Reactjs 및 중포 기지 게시 양식 오류 메시지

Firebase: No Firebase App '[DEFAULT]' has been created - call Firebase App.initializeApp() (app/no-app).와 점점이 라인을 가리키는 반응 코드의

여기

> 37 | const itemsRef = firebase.database().ref();

&는

아래에있는 내 코드입니다

App.js 파일

import React, { Component } from 'react'; 
import { Container, Grid, Form, Button } from 'semantic-ui-react'; 
import firebase from 'firebase'; 
import './FirebaseAdmin'; 
import './App.scss'; 

class RegistrationFormFields extends React.Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     firstName: '', 
     lastName: '', 
     email: '' 
    }; 

    this.handleChange = this.handleChange.bind(this); 
    this.handleSubmit = this.handleSubmit.bind(this); 

    // this will help us reset the form later 
    this.baseState = this.state; 
    } 

    handleChange(e) { 
    this.setState({ 
     [e.target.name]: e.target.value 
    }); 
    } 

    handleSubmit(e) { 
    e.preventDefault(); 

    /** 
    * store all of everything thats being submitted, 
    * We do this by calling the ref method and passing 
    * in the destination we'd like them to be stored 
    */ 
    const itemsRef = firebase.database().ref(); 

    /** 
    * here we grab the item the user typed in from the state, 
    * and package it into an object so we ship it off to our 
    * Firebase database. 
    */ 
    const item = { 
     firstName: this.state.firstName, 
     lastName: this.state.lastName, 
     email: this.state.email 
    } 

    console.log(item); 

    /** 
    * similar to the Array.push method, 
    * this sends a copy of our object so 
    * that it can be stored in Firebase. 
    */ 
    itemsRef.push(item); 

    /** 
    * here we clear out form values after 
    * everything is done 
    */ 
    this.setState(this.baseState); 
    } 

    render() { 
    return (
     <div className="registration-wrapper"> 
     <Form onSubmit={this.handleSubmit}> 
      <Form.Group widths={2}> 
      <Form.Input label='First name' name="firstName" placeholder='First name' onChange={this.handleChange} value={this.state.firstName} /> 
      <Form.Input label='Last name' name="lastName" placeholder='Last name' onChange={this.handleChange} value={this.state.lastName} /> 
      </Form.Group> 
      <Form.Input label='Email address' name="email" placeholder='Email address' onChange={this.handleChange} value={this.state.email} /> 
      <Button type='submit' value="Submit">Submit</Button> 
     </Form> 
     </div> 
    ); 
    } 
} 

class App extends Component { 
    render() { 
    return (
     <Container> 
     <Grid.Row> 
      <RegistrationFormFields /> 
     </Grid.Row> 
     </Container> 
    ); 
    } 
} 

export default App; 

모든 도움을 웹하지만 고체 아무것도 덕분에 주위를 찾고있다. 나는 내 자격 증명으로 firebase 관리자 설정 파일을 가지고 있지만 도움이되지 못했습니다. 그래서 다시 오버플로 오버 플로우에 의존하기로 결정했습니다.

답변

0

신중히 조사한 후에 firebase 구성 파일을 내 주 index.js에 가져 와서 내 솔루션을 찾았습니다. 내 반응 앱을 렌더링합니다.