Vue.js bindings for Cloud Firestore

VueFire makes it super easy to bind firestore collections and documents and keep your local data always up to date with their remote versions.

If you are looking for Firebase realtime support, install v1 instead: npm i vuefire@v1

npm i vuefire@next

Vue.use(VueFire) // initialize your firebase app firebase.initializeApp({ projectId: 'YOUR OWN ID', databaseURL: 'YOUR OWN URL' }) // save a reference to the firestore database // to access it in the future const db = firebase.firestore() new Vue({ data: { todos: [], currentTodo: null }, firestore: { todos: db.collection('todos'), currentTodo: db.collection('todos').doc('1') } })

Always declare the initial properties like todos and currentTodo: in your data.

Tips:

• Use an empty array [] as the initial value for a property that holds a collection to make v-for always work.
• Use null for documents so you can wrap content with a simple v-if (ref vue guide)

In Could Firestore you can reference other documents inside of documents (TODO add link). By default VueFire will automatically bind up to one nested references. TODO make sure this is the right choice.

Clone the repo, then:

$ npm install $ npm test

MIT