登录界面
语法糖
<script>
import { mapMutations } from "vuex";
export default {
name: "Login",
data: function () {
return {
loginForm: {
account: "",
passWord: "",
},
loginRules: {
account: [{ required: true, message: "请输入账号", trigger: "blur" }],
passWord: [{ required: true, message: "请输入密码", trigger: "blur" }],
},
};
},
methods: {
...mapMutations(["changeLogin"]),
submitForm() {
const userAccount = this.loginForm.account;
const userPassword = this.loginForm.passWord;
if (!userAccount) {
return this.$message({
type: "error",
message: "账号不能为空!",
});
}
if (!userPassword) {
return this.$message({
type: "error",
message: "密码不能为空!",
});
}
console.log("用户输入的账号为:", userAccount);
console.log("用户输入的密码为:", userPassword);
},
},
};
</script>
mapMutations是vuex的mutation的辅助函数,用于在组件中映射mutation内的方法,以便在该组件中直接使用mutation里的方法。
import{ } from ’ ’
script methods 调取函数
:model=“ruleForm” 是要绑定的数据
:rules=“rules” 是要绑定的表单验证规则
ref=“ruleForm” 是给el-form这个组件起的名称
prop=“name” 是验证规则的属性
this.$refs.editFormRefs.resetFields()
需要ref model rule 和prop
(在ele-form-item中)
idea打开数据库时区问题
附上
?serverTimezone=GMT
即可