LoginSignup
0
0

More than 3 years have passed since last update.

[Nuxt]Vueでcomputedが変更を検知してくれない場合

Last updated at Posted at 2021-04-23

考えられる原因

Vueでは普通ならcomputedは依存する変数などが変化すれば自動で値も更新されるはずですが、公式ドキュメントにも書いてあるように、配列やオブジェクトの一部の変更は検知できないようです。
https://jp.vuejs.org/v2/guide/reactivity.html#%E9%85%8D%E5%88%97%E3%81%AB%E9%96%A2%E3%81%97%E3%81%A6

解決法

今回は配列でインデックス指定で値を変更する場合について話します。Vueにおいてどう対策すればよいかは公式ドキュメントにあるので割愛します。Nuxtの場合は以下のようにします。

関数名(引数) {
this.$set(配列名, インデックス, 代入する値)
}

もしViewの部分で直接使いたいなら、$set(配列名, インデックス, 代入する値)で結構です。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0