回车事件

src/views/login/index.vue

@@ -13,14 +13,18 @@
                     <el-form-item label="" prop="username">
                       <el-input v-model="form.username" placeholder="请输入登录账号">
                         <template #prefix>
-                          <el-icon><User /></el-icon>
+                          <el-icon>
+                            <User />
+                          </el-icon>
                         </template>
                       </el-input>
                     </el-form-item>
                     <el-form-item label="" prop="password">
                       <el-input v-model="form.password" type="password" show-password placeholder="请输入登录密码">
                         <template #prefix>
-                          <el-icon><Unlock /></el-icon>
+                          <el-icon>
+                            <Unlock />
+                          </el-icon>
                         </template>
                       </el-input>
                     </el-form-item>
@@ -42,7 +46,7 @@
 // 基础
 
 import type { Ref } from 'vue';
-import { onMounted, ref, reactive } from 'vue';
+import { onMounted, ref, reactive, unRef } from 'vue';
 import type { FormInstance, FormRules } from 'element-plus';
 import { ElMessage } from 'element-plus';
 import { useRouter } from 'vue-router';
@@ -56,15 +60,23 @@ const adminAxios = AdminStore();
 const router = useRouter();
 // 表单
 const formRef = ref<FormInstance>();
-const form: Ref<any> = ref({});
+interface formData {
+  username?: string;
+  password?: string;
+}
+const form: Ref<formData> = ref({});
 const rules = reactive<FormRules>({
   username: [{ required: true, message: '请输入登录账号', trigger: 'blur' }],
   password: [{ required: true, message: '请输入账号密码', trigger: 'blur' }]
 });
 // 请求
-onMounted(async () => {});
+onMounted(async () => {
+  window.addEventListener('keydown', (e) => {
+    if (e.code === 'Enter') toSave(formRef.value);
+  });
+});
 // 提交登录
-const toSave = async (formEl: any) => {
+const toSave = async (formEl: FormInstance) => {
   if (!formEl) return;
   await formEl.validate((valid: any) => {
     if (valid) {
@@ -74,7 +86,7 @@ const toSave = async (formEl: any) => {
     }
   });
 };
-const toLogin = async (data: any) => {
+const toLogin = async (data: formData) => {
   let res: IQueryResult = await adminAxios.login(data);
   if (res.errcode == '0') {
     ElMessage({ message: `登录成功`, type: 'success' });