template の functional プロパティを知った
コードを読んでいたら SFC で<template functional>
という書き方を見つけて、この書き方を初めて見たのでちょっと調べてみた。
Vue に関数型コンポーネントがあったのを知らなかった。React だけかと思ってた……。
この書き方だと、template 内で props の値を使うときにprops.xxx
という書き方をしなければいけないっぽい。
他にもlisteners
など知らない機能がいくつもあって、「こんなのあったんだ……」という気持ちになった。
Vue3 ではパフォーマンスの向上はわずかなのでステートフルコンポーネントのみの使用を推奨しますと書いてあった。Vue をアップデートするときに関数型コンポーネントはリファクタリングしてしまうべきっぽい。
Vue3 で関数型コンポーネントを SFC で作る場合は props を$props、attrsを$attrs にして listeners は削除できるらしいので、ひとまずこっちに寄せるのでもいいかも。