2016-09-04 4 views
0

Я слежу за этим скринкастом на YouTube, но для жизни я не могу заставить свою базу данных разговаривать с моим приложением React.React: Firebase Listener не работает

componentDidMount() функция в настоящее время, но .on() слушатель функция не стрельба, похоже.

Мой код выглядит следующим образом:

index.js

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import App from './App'; 
import './index.css'; 
import * as firebase from 'firebase'; 

var config = { 
    // config from firebase db lives here 
}; 

firebase.initializeApp(config); 

ReactDOM.render(
    <App />, 
    document.getElementById('root') 
); 

App.js

import React, { Component } from 'react'; 
import logo from './logo.svg'; 
import './App.css'; 
import * as firebase from 'firebase'; 

class App extends Component { 

    constructor() { 
    super(); 
    this.state = { 
     speed: 10 
    } 
    } 

    componentDidMount() { 
    const rootRef = firebase.database().ref().child('react'); 
    const speedRef = rootRef.child('speed'); 

    speedRef.on('value', snap => { 
     this.setState({ 
     speed: snap.val() 
     }); 
    }); 
    } 

    render() { 
    return (
     <div className="App"> 
     <h1>{this.state.speed}</h1> 
     </div> 
    ); 
    } 
} 

export default App; 

FWIW, мой дб выглядит следующим образом:

enter image description here

Я получаю нулевые ошибки в консоли и полностью из идей. Все, что я делаю неправильно.

Любая помощь приветствуется. Заранее спасибо!

+0

Решенный! Это связано с правилами моей Firebase READ. Может кто-то закрыть это. – realph

+1

Правильная вещь - сделать ответ на свой вопрос, а затем принять этот ответ. Это тоже моя проблема, и ваш вопрос/ответ заставил меня ответить на правильный ответ. – awwester

+0

@awwester Добавлен ответ. – realph

ответ

3

Решенный! Эта проблема связана с моими правилами Firebase READ. Если вы столкнулись с подобной проблемой, проверьте правила в своей базе данных.

Смежные вопросы