vue注意すべき点1

プロジェクトで出会った穴は、長い間苦しめられていましたが、ドキュメントをめくって次の内容を発見しました.ここで引用します.
Vueはオブジェクト属性の追加または削除を検出できません.Vueはインスタンスの初期化時に属性に対してgetter/setter変換を行うため、Vueを応答式に変換するにはdataオブジェクト上に属性が存在する必要がある.
var vm = new Vue({ data:{ a:1 } })//`vm.a`は応答式のvmである.b = 2//`vm.b`非応答式
すでに作成されたインスタンスの場合、Vueではルートレベルのレスポンス属性を動的に追加できません.ただし、Vue.set(object, propertyName, value)メソッドを使用してネストされたオブジェクトに応答属性を追加することができます.たとえば、次のようになります.

Vue.set(vm.someObject, 'b', 2)

また、vm.$setインスタンスメソッドを使用することもできます.これは、グローバルVue.setメソッドの別名です.

this.$set(this.someObject,'b',2)

Object.assign()または_.extend()を使用するなど、既存のオブジェクトに複数の新しいプロパティを割り当てる必要がある場合があります.ただし、オブジェクトに追加された新しいプロパティは更新をトリガーしません.この場合、元のオブジェクトとブレンドするオブジェクトのプロパティを使用して、新しいオブジェクトを作成する必要があります.

//    `Object.assign(this.someObject, { a: 1, b: 2 })`
this.someObject = Object.assign({}, this.someObject, { a: 1, b: 2 })