VueとFirebase：一部の `data`がFirebaseに保存されないようにします

Question

Firebaseに同期されるコンポーネントがあります。

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

titleはデータベースに保存されなければならないが、中だけの要素を表示し、隠すために使われていますので、isShownはいけない：私は、コンポーネントのインスタンスがないがFirebaseに同期されますか、いくつかの性質を持つようにしたいですブラウザ。

コンポーネントインスタンスに反応的なプロパティを追加する方法はありますか？Firebaseに同期させないでください。

Answer 1

Firebaseデータ参照のみがFirebaseに同期されます。 dataオブジェクトのエントリは、Vue内で反応しますが、デフォルトではサーバーに同期されません。コンポーネントのプロパティは、親コンポーネントがプロップで渡した内容に応じて、firebase参照またはプレーン側のデータオブジェクトにすることができます。

いくつかの例：

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 
}