[Vue.js] データを変更したときに画面が更新されない

Vue.js でデータを変更したのに画面が更新されず、はまったのでメモ。

配列やオブジェクトを直接変更している

Vue.set を使う必要があります。

• https://jp.vuejs.org/v2/guide/reactivity.html#%E5%A4%89%E6%9B%B4%E6%A4%9C%E5%87%BA%E3%81%AE%E6%B3%A8%E6%84%8F%E4%BA%8B%E9%A0%85

Vue がネストしている

今回私がはまったのはこちらでした。 ネストしていると子供側が上手く動作しないようです。

• https://gist.github.com/xl1/fa72b71e775c7ffd5788

私はネストしないように変更して対応しました。

参考 URL

• https://qiita.com/bobu_web/items/ec5a98d03758d12ad721
• https://gist.github.com/xl1/fa72b71e775c7ffd5788
• https://note.com/ojk/n/nf41aeaf12307