[Vue.js 2]リスト内を検索してあれば更新する例

2020-03-302020-12-27IT記事Vue.js

リストの中のオブジェクトを検索して、あればそのオブジェクトを更新するにはどうしようかな、となって以下のように書いた。

// listからidで探して更新する
updateListItem2(list, value) {
  const idx = list.findIndex((item) => item.id === value.id);
  if (idx !== -1) {
    list.splice(idx, 1, value);
  }
}

findIndexでIndexを探して、splliceで置き換える。

Vueでは、dataの変更をして、変更の結果がすぐにview側に反映されるようにするには、指定された関数を使う必要がある。今回はspliceを使った。

参考: https://jp.vuejs.org/v2/guide/list.html