Franva
Franva

Reputation: 7077

Rebase syncState does not update Firebase data

I'm using Mobx + Reactjs + Firebase + Re-base

I have my base.js like:

import firebase from 'firebase';
import Rebase from 're-base';
import 'firebase/database';

var app = firebase.initializeApp({
    apiKey: "xxxxxx",
    authDomain: "xxxxxx",
    databaseURL: "xxxxx",
    projectId: "xxxxxx",
    storageBucket: "xxxxx",
    messagingSenderId: "xxxxxx"
  });

  export var db = firebase.database(app);
  var base = Rebase.createClass(db);

  export default base;

On my TodoList.jsx

@observer
class TodoList extends React.Component {

  constructor(props){
    super(props);

    this.state={
      todos: []
    };

    this.todosRef = base.syncState(`todos`,{
      context: this,
      state:'todos',
      asArray: true,
      then: function(spa){
        console.log("Success!", spa);
      },
      onFailure: function(){
        console.log("Failed!");
      }
    });


    //this.setState({
    //  todos: this.props.store.todos
    //});

    console.log("this.state.todos", this.state.todos);
  }
  ...........

What else I did:

I ran firebase-cli commands:

firebase init (I chose Single-Page app, set database rules read and write true for testing purpose) It creates several files.

But no matter how I change my code, the data from my web app, doesn't update into my Firebase database.

Upvotes: 0

Views: 967

Answers (2)

rohaldb
rohaldb

Reputation: 588

In my case I was upating state from the react chrome dev tools which will not update your firebase db. Only updating the state programmatically using setState will

Upvotes: 0

codejays
codejays

Reputation: 911

  export var db = firebase.database(app);

should be:

export var db = app.database();

Your syncState stuff should be in componentDidMount(){...} instead.

Upvotes: 1

Related Questions