elementui vue 前端笔记

登录界面

语法糖

<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

即可