【Vue.js】クラスで指定した複数の要素を初期化する

Vue.jsの初期化時に el プロパティに '.item' など、クラス名で複数の要素を指定したいことがあります。

new Vue(
  el: '.item',
  ...
});

しかしVue.jsではelプロパティに複数の要素を指定することはできません。
クラス名での指定は可能ですが、単一の要素である必要があります。

とはいえ一つ一つ初期化していたのでは面倒なので、次のように書くことで一括で初期化することができます。

const items = document.querySelectorAll('.item');

// HTMLCollectionはforEachが使える
items.forEach((el, i) => {

  new Vue(
    el, // HTMLElementをそのままelプロパティに渡す
      ...
    });
  }

});

Array.prototype.forEach.call(elements, handler); としても同じですので、状況によって使い分けてください。

参考：javascript – Vue instance using classes – Stack Overflow