データ (data) [Vue.js]

データ (data)

参考：

data | Vue.js [公式]

使い方

参考：

データとメソッド | Vue.js [公式]

データを扱うメソッド

• vm.$watch
• vm.$set
• vm.$delete

参考：

vm.$watch( expOrFn, callback, [options] ) | Vue.js [公式]

vm.$set( target, key, value ) | Vue.js [公式]

vm.$delete( target, key ) | Vue.js [公式]

インスタンスメソッド / データ | Vue.js [公式]

オブジェクト

参考：

オブジェクトの変更検出の注意 | Vue.js [公式]

Vue.js は気難しい オブジェクト編 – Qiita

Vue.js で連想配列を動的に変更させるときの注意点 – Qiita

Vue.set / vm.$set

Vue.set(vm.userProfile, 'age', 27)

もしくは、

vm.$set(vm.userProfile, 'age', 27)

参考：

オブジェクトの変更検出の注意 | Vue.js [公式]

data プロパティに動的に値を追加する方法 (と JS の基本を理解してなかったという話) – Qiita

Set object in data from a method in VUE.js – Stack Overflow

Object.assign

vm.userProfile = Object.assign({}, vm.userProfile, {
  age: 27,
  favoriteColor: 'Vue Green'
})

参考：

オブジェクトの変更検出の注意 | Vue.js [公式]

TypeScript で型を指定する

参考：

Vue.js の data オプションで型を宣言的に書く方法 – Qiita

vm.$forceUpdate

参考：

Vue.js で後から追加したデータを反映させる方法 – Qiita

vm.$forceUpdate | Vue.js [公式]