Vue和Firebase：防止將某些“數據”保存到Firebase

Question

我有一個組件已同步到Firebase。 我希望組件實例具有一些不同步到Firebase的屬性：

Vue.component('myComponent', {
    data: function(){
        return {
            title: '',
            isShown: false
        }
    }
});

title應該保存到數據庫，而isShown不應保存，因為它僅用於顯示和隱藏瀏覽器中的元素。

是否可以在不將響應屬性同步到Firebase的情況下將響應屬性添加到組件實例？

Answer 1

僅將Firebase數據引用同步到Firebase。 data對象中的條目將在Vue中起反應性，但默認情況下不會同步到服務器。 組件屬性可以是firebase引用或普通客戶端數據對象，具體取決於父組件在prop中傳遞的內容。

一些例子：

var firebaseApp = firebase.initializeApp({ ... });
var db = firebaseApp.database();

Vue.component('myComponent', {
  data: function() {return {
    foo: true,                      // <-- 'foo' will not be synced
  }},
  firebase: function() {return {    // (vuefire hook)
    bar: db.ref('path/to/bar')      // <-- 'bar' will be synced
  }},
  mounted: function() {return {
    this.$bindAsArray('baz',db.ref('path/to/baz')) // <-- 'baz' will be synced
    // ($bindAs is also from vuefire)
  }},
  props: [qux] // <-- depends on what the parent component passed down 
}