🚀

Nuxt.jsでWebアプリケーション開発メモ5

に公開
Nuxt 3
Claude
tech

概要

ログイン画面の改善。

  • EnterキーでLOGIN処理が実行されるようにする。
    • Form要素を使用するようにした。
  • LOGINボタンにマウスホバーすると指カーソルになるようにする。
  • LOGINボタンの要素がbuttonだったので、UButtonに変更。

プロンプト5

# 命令5
ログイン画面の改善を行ってください。
- LOGINボタンにhoverしたとき、指アイコンになるようにして。
- EnterキーでLOGINボタンクリックと同じ挙動になるようにして。

追加命令

上記命令で不足していた分を追加した。

  • button 要素を UButton に変更して。
  • ログイン画面で form 要素を使用するようにして。
    • NUXT UIの UForm か通常の form かどちらが良いかを聞いてみたが、ログイン画面は単純なform画面だったので通常の form を採用した。
    • UForm は高機能だが複雑とのことでここでは採用見送り。

ソースコード差分

https://github.com/tkure/prototype-frontend/commit/86d6fd6d286d192a307138855b573f45237b40da

→ Nuxt.jsでWebアプリケーション開発メモ6

Discussion