Search code examples
firebasevue.jsgoogle-cloud-firestorenativescriptnativescript-vue

How to Use Firebase with Nativescript-Vue?


I've been trying to implement just a simple Firebase fetch since November. At this point, I wish I'd just created a new Rails api; it would have been faster. But everyone insists Firebase is Oh So Simple.

In app.js,

import firebase from 'nativescript-plugin-firebase';

That part seems OK. Instructions are all over the place after that. The plugin's ReadMe suggests an initialization:

firebase.init({
  // Optionally pass in properties for database, authentication and cloud messaging,
  // see their respective docs.
}).then(
    function () {
      console.log("firebase.init done");
    },
    function (error) {
      console.log("firebase.init error: " + error);
    }
);

Several others have insisted that the init code is unnecessary. It does run without errors, but the code he gives after that produces nothing. Also,

const db = firebase.firestore;
const UserStatusCollection = db.collection("UserStatus"); 
UserStatusCollection.get();

produce an empty object {}.

Here's my Firebase collection: Here's my Firebase collection.

If I wrap the firebase call in async/await (and no one is showing it as this complicated),

async function getFireStoreData() {
  try {
    let result = await this.UserStatusCollection.get();
    console.log(result);
    return result;
  } 
  catch (error) {
    console.error(
      "UserStatusCollection.get()" + error
    );
  }
}

And call that

let temp2 = getFireStoreData();
console.log("temp2:" + temp2);

All I ever get is an object promise.

As I said, I wish I had just built up a new Rails API and had a far simpler life since November.


Solution

  • Your getFireStoreData method is asynchronous and you're not awaiting it. That is probably the reason why you're getting a promise back. Try to await getFireStoreData(). See if that works.

    Since it's also a promise, you can try to use .then.

    getFireStoreData().then(data => {
      console.log(data);
    })