这是一个创建于 1104 天前的主题，其中的信息可能已经有所发展或是发生改变。
<script setup lang="ts">
import { reactive, ref } from 'vue';
import type { FormInst, FormRules } from 'naive-ui';
import { EnumLoginModule } from '@/enum';
import { useAuthStore } from '@/store';
import { useRouterPush } from '@/composables';
import { formRules } from '@/utils';
import { OtherAccount } from './components';
const auth = useAuthStore();
const { login } = useAuthStore();
const { toLoginModule } = useRouterPush();
const formRef = ref<HTMLElement & FormInst>();
const model = reactive({
userName: 'Soybean',
password: 'soybean123'
});
const rules: FormRules = {
password: formRules.pwd
};
const rememberMe = ref(false);
async function handleSubmit() {
await formRef.value?.validate();
const { userName, password } = model;
login(userName, password);
}
function handleLoginOtherAccount(param: { userName: string; password: string }) {
const { userName, password } = param;
login(userName, password);
}
</script>
<style scoped></style>
Footer
© 2022 GitHub, Inc.
Footer navigation
Terms
Privacy
这段代码不是太懂，求大佬们帮解释下
我看登陆是调用 handleSubmit，handleSubmit是await formRef，这个 formRef 的值ref<HTMLElement & FormInst>();是啥意思?
const { login } = useAuthStore();这个也不是很懂，我看也没有 import login 函数啊，这行代码的意思是 把 useAuthStore 的返回值 赋给 login 函数？
 |
1
renmu 2022-10-22 22:41:42 +08:00 via Android
formref 就是一个那个自定义 form 标签的 ref ，然后调用 validdate 方法。
@/store 里有个 useauthstore 函数，里面有登录的逻辑 |
 |
2
vecZro 2022-10-22 22:48:00 +08:00 via Android
formRef 应该是获取表单组件的引用吧，提交表单的时候调用这个表单组件的 validate 方法进行表单数据的验证
const { login } = useAuthStore()就是解构 useAtuStore 函数执行完会返回一个对象，这个对象里面会包含这个 login 属性 const res = useAuthStore() const login = res.login https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment |
Select Language