『コンポーネントをカスタムフックで提供してみた』という記事に感動したので、Vue.js(以下Vue)で利用する方法を紹介します。概念などは当該記事にて詳しく書いてあるので、この記事では主に実装と個人的な感想を述べます。 Vue.jsバージョン Vueでもバージョン3から正式導入されているComposition APIを使えば当該記事のようにカスタムフック、Vueでの名称はコンポーザブル関数(Composable Function)に切り分けることができます。ただし、VueはJSXそのままではテンプレート内で使えないので、少し工夫が必要です。 ソースコード全体はこちら ▼Checksコンポーネント <script setup lang="ts"> type Props = { checkList: readonly boolean[]; labels: readonly string[];