Vue2からVue3のバージョンアップで変更された書き方

今回はVue2からVue3のバージョンアップで変更された点をいくつか紹介していきたいと思います。

書き方や構文が変更されているのでVue2で動いていたけどVue3にしたことで表示がされなくなった、動かなくなったということもあるので注意しましょう。

Vue3の変更点

Vue3になったことでVueインスタンスを作成するときの書き方が変更されています。

new Vue({
  el: '#app',
  data: {
    message: 'New world'
  }
});

createApp({
  data() {
    return {
      message: 'New world'
    };
  }
}).mount('#app');

Vue2ではVueコンストラクタを使用してVueインスタンスを作成していましたがVue3では「createApp」を使用してVueインスタンスを作成します。

<div v-model.number="age">

Vue2で使用していた「Filter」はVue3で廃止になったようです。