前端学习——后台管理系统

最新推荐文章于 2024-07-30 13:51:05 发布

weixin_57896572

最新推荐文章于 2024-07-30 13:51:05 发布

阅读量452

点赞数

文章标签：学习 git vue.js

本文链接：https://blog.csdn.net/weixin_57896572/article/details/128560874

版权

1 git 相关命令

git status：查看当前工作区是否干净；开始开发前先检查一下；
git checkout 分支名：切换到某个分支
git checkout -b 分支名：创建一个新的分支；每个新的功能都应该创建一个新的分支；
git branch：查看当前项目的所有分支；*代表当前正处于的分支；
git add . :将修改后的文件添加到缓存区
git commit -m "提交文本信息"：将缓存区的文件提交到本地仓库
git merge 分支名：将某分支合并到总分支
1. 将分支合并到master时，要先切换到master分支中
git push：切换到想推送的分支，运行命令，将本分支最新的的代码推送到云端仓库
git push -u origin 远程分支名称：首次将本地的分支中的代码推送到云端，首先得切换到要推送的分支，然后输入命令

2 实操经验

给表单绑定校验规则
1. 给表单el-form绑定校验规则:rules="loginFormRules"
2. 在data中配置校验规则为一个对象loginFormRules:{username:[],password:[]}
3. 给每个el-form-item配置prop属性，绑定校验规则prop="username"

拿到服务器返回的数据

使用post方法得到返回数据为promise时，可以用await进行修饰，即：await this.$http.post("请求路径", 请求参数)
使用await进行修饰时，需将该函数设置为异步函数，在函数开头加async

this.$refs.loginFormRef.validate(async (valid) => {
        // 预校验失败，则返回
        if (!valid) return;
        // 预校验成功，发送post请求
        const { data: res } = await this.$http.post("login", this.loginForm);
        if (res.meta.status !== 200) {
          console.log("登录失败");
        } else {
          console.log("登录成功");
        }
});

表格索引列
1. 给表格加type属性，将type设置为index即可
2. <el-table-column type="index" label="#"></el-table-column>
表格展开列
1. 给表格加type属性，将type设置为expand即可
2. <el-table-column type="expand"></el-table-column>

自定义校验规则

现在data(){ var 自定义校验规则; return{}}的return前用var自定义校验规则

    // 自定义邮箱校验规则
    var 自定义校验规则名 = (rule, value, callback) => {
      // 通过正则进行校验
      const reg值名称 = 验证该值的正则表达式;

      if (reg值名称.test(value)) {
        // 合法的邮箱
        return callback();
      }

      callback(new Error("请输入合法的xx值"));
    };

自定义校验规则

在验证规则对象中，找到要添加规则的对象，用validator指定验证规则名。例如：
1. { validator: checkEmail, trigger: "blur" }

3 CSS新学样式

justify-content:flex-start|flex-end|center|space-between|space-around|initial|inherit主轴对齐
align-items:flex-start|flex-end|center|space-between|space-around多行侧轴对齐
display:flex. 弹性盒模型
letter-spacing：字间距
min-width：最小宽度