Vue Component の省略記法について

Vue にはいくつかの省略記法がありますが、Vue Component 内での記法の違いを初めて見たときは意味わからなかったので書き残しておきます。

スポンサーリンク

例1

関数等の中身は重要じゃないので省きます。

こういうコンポーネントがあったとして、function を省略すると次の例のようになります。

例2

たったこれだけのことです。ライフサイクルフックは別にどっちで書いても動くのでいいんですが、ドキュメントを深く読まなかったひよこの私には特に data プロパティが混乱を招く原因となりました。

data プロパティ

Vue インスタンスと Vue コンポーネントで書き分ける必要があります。

上がインスタンスで、下がコンポーネントです。data プロパティの function を省略すると似通ってしまって、どう違うのかよくわかりません。

Vue コンポーネントには関数を使わなければならないため、このようなコードになります。インターネットからコピペしてると意味わからなくなります。それだけです。

まとめ

意味がわかった後に振り返ると非常にレベルが低い。

コメントを残す

メールアドレスが公開されることはありません。

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください