登录页面支持回车键提交表单
将 on_submit 改为 Callback::new,在用户名和密码输入框上监听 onkeydown 事件,按下 Enter 键时触发登录提交。 Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
f3204e108b
commit
e358f2af7d
@ -11,7 +11,7 @@ pub fn LoginPage() -> Element {
|
||||
let mut password = use_signal(|| "".to_string());
|
||||
let mut error = use_signal(|| None::<String>);
|
||||
|
||||
let on_submit = move |_| {
|
||||
let on_submit = Callback::new(move |_| {
|
||||
error.set(None);
|
||||
|
||||
let username_val = username();
|
||||
@ -60,7 +60,7 @@ pub fn LoginPage() -> Element {
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
});
|
||||
|
||||
rsx! {
|
||||
div { class: "min-h-screen flex items-center justify-center bg-white dark:bg-[#1d1e20]",
|
||||
@ -86,6 +86,7 @@ pub fn LoginPage() -> Element {
|
||||
placeholder: "用户名或邮箱",
|
||||
value: username(),
|
||||
oninput: move |e| username.set(e.value()),
|
||||
onkeydown: move |e| if e.key() == Key::Enter { on_submit(()) },
|
||||
}
|
||||
}
|
||||
div {
|
||||
@ -98,11 +99,12 @@ pub fn LoginPage() -> Element {
|
||||
placeholder: "密码",
|
||||
value: password(),
|
||||
oninput: move |e| password.set(e.value()),
|
||||
onkeydown: move |e| if e.key() == Key::Enter { on_submit(()) },
|
||||
}
|
||||
}
|
||||
button {
|
||||
class: "w-full py-2 px-4 bg-gray-900 dark:bg-[#dadadb] text-white dark:text-gray-900 font-medium rounded-full hover:opacity-80 transition-opacity",
|
||||
onclick: on_submit,
|
||||
onclick: move |_| on_submit(()),
|
||||
"登录"
|
||||
}
|
||||
a {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user