#解決したい課題
エンターキー押下時に、ボタン押下と同じ挙動にしたい。
##課題の詳細
v-form 内に v-text-field が2つある場合、v-text-fieldの韻字的なtype="button"が2つになってしまい(ここは仮定)
意図していないがエンターキーでsubmitがされない状態。
#結論
※参考
https://qiita.com/sd131/items/06e13b5008efc41102d1
※参考サイトからの引用
v-form、v-btnコンポーネントを利用していると、 v-btnがtype="button" となる。
よって、テキストフィールドがあり、submitボタンがない状態のため 、Implicit submission (暗黙の submit)という HTML の仕様により、エンターキーで submit され、リロードされてしまう。
従って、そのtext内でエンターキーによるsubmitを有効化したいときは、
その内にkeyイベントを以下のように追加してあげれば良い。
<v-text-field>
@keydown.enter="submit"
</v-text-field>
keydownとkeyupとkeypressの違いは以下がわかりやすい。
https://murashun.jp/blog/20191110-52.html
vuetify.jsのbuttonイベントについては以下にかなりまとまっている。
公式:https://v15.vuetifyjs.com/ja/components/buttons/
Qiita:https://qiita.com/rubytomato@github/items/890d59804978aa959e9c
Qiita、すげーな。。。