2017-09-19 7 views
1

私はVue.js 2.4.2 SPA用のjs-data 3.0.1ストアとして使いたいと思います。すべてが魅力的に機能しますが、残念ながら私は反応的なデータバインディングを動作させることはできません。js-data.io as Vue.js store

私は既にvue-js-dataを試しましたが、これは壊れているようです。

次の例は機能しません。テキストフィールドを変更すると、テキストは更新されません。しかし、js-dataレコードを普通の古いJSオブジェクトで置き換えると、期待どおりに動作します。

user.vue

<template> 
    <div> 
    <input name="name" v-model="user.name" /> 
    <br /> 
    Name: {{user.name}} 
    </div> 
</template> 

<script> 
    export default { 
    data() { 
     return { 
     user: this.store.createRecord('user') 
     } 
    } 
    } 
</script> 

私はデータが(たとえばv-modelを経由して)結合させるためにどのように任意のアドバイスに感謝の仕事。

答えて

2

Userクラスのconstructorにこれを追加すると、すべてのルートレベルのプロパティで機能するはずです。完全な例についてはこちらをご覧ください:https://gist.github.com/calebroseland/2fa37abdb5560739b3b4b901382b0a90

// apply vue reactivity 
    for (let key in this) { 
    Vue.util.defineReactive(this, key, this[key]) 
    } 

    // re-apply js-data schema 
    this._mapper().schema.apply(this) 

VUEとJS-データ反応性はアウトオブボックス一緒に動作しない理由は、彼らの両方がわずかに異なるメカニズムを使用して、別の実装を持っているということです。説明は次のとおりです:https://medium.com/p/525ffe12ad81#c925