I'm currently working on integrating Vuefire into my project. I have been following the instructions provided on the Vuefire website, but I am encountering an error.
db.js:
import firebase from 'firebase/app'
import 'firebase/firestore';
const firebaseConfig = {
apiKey: ....,
authDomain: ....,
projectId: ....,
storageBucket: ...,
messagingSenderId:....,
appId: ..."
};
const app = firebase.initializeApp(firebaseConfig)
export const db = app.firestore()
main.js
import Vue from 'vue';
import App from './App.vue';
import vuetify from './plugins/vuetify';
import { firestorePlugin } from 'vuefire'
import DatetimePicker from 'vuetify-datetime-picker';
Vue.use(firestorePlugin)
Vue.config.productionTip = false;
Vue.use(DatetimePicker)
new Vue({
vuetify,
render: h => h(App)
}).$mount('#app');
App.vue
import { db } from "../db";
export default {
name: "App",
data() {
return {
fireDB: [],
},
mounted() {
console.log(this.fireDB);
},
firestore: {
// fireDB: db.collection("something").doc('else').get().then((res) => {
// console.log(res);
// }) - encounter an error when using this approach.
//fireDB: db.collection("something") - generates an array with an object representing the database when used.
},
};
The console suggests that the 'document' where onSnapshot is invoked is a promise.