2014-10-21 Vue.js 0.11.0-rc2でデータを追加する

以前も少し触っていたVue.jsをまた触り始めたりして、いくつか覚えたことがあるのでメモをしておく。以前触っていたときのバージョンは0.10系だったけど、今回は0.11系を使ってみる事にした。

データを後から追加してデータバインドとして反映されるようにする

var obj = new Vue({});

obj.$data.$add('items', [
  { hoge: 1 },
  { hoge: 2 },
  { hoge: 3 }
]);
obj.$mount('#id');

これは

var obj = new Vue({
  data: {
    items: [
      { hoge: 1 },
      { hoge: 2 },
      { hoge: 3 }
    ]
  }
});
obj.$mount('#id');

と同じになる。まあ、最初からデータが用意できるのであればこちらで良いと思う。

$data.$add()でわざわざ追加するよりかは、空の配列をあらかじめ用意しておいて、それに対してitems.push()した方が楽なのかもしれない。

CodePenで書いた。