简化Vuetify的数据表格代码结构

表格函数

• 化简Vuetify的数据表格的函数
• 理解写函数的重要原则

带领操作化简Vuetify数据表格的函数

• 使用代码下载地址：
• 参考Vuetify文档：
• 化简函数

化简函数的重点

• 函数调用：@click
  • 凡是页面点击，都调用同一个函数，将点击操作的类型传入作为参数，这样所有的操作函数都会被放在一起，功能和结构就会清楚了。
• 函数要按照功能分开写
• 函数名字要有意义

作业

• 照着演示，自己动手做一遍
• 总结函数按照功能可以分为哪几类
• 总结化简函数的原则
• 尝试魔改代码

入门培训总结：前端页面和数据库的连接

已经学习的内容

应用开发的基础工具：SQL、HTML、Javascript

HTML和Javascript是前端，SQL是后端。

还没有学到的：

• 如何把数据库里的东西带到前端
• 如何把前端的操作带到后端
• 如何确保只有正确的人才能做特定的事

这是下一个培训要学习的内容：

• 应用开发的框架
• 前端和后端的连接
• 用户权限检查

表格模板

• 复习Vuetify的数据表格
• 化简Vuetify的数据表格
• 找到模板代码中的重要组件

带领操作化简Vuetify的数据表格模板

• 使用代码下载地址：
• 参考Vuetify文档：
• 化简模板
  • 案例1：Vuetify自带的甜品列表
  • 案例2：校务管理系统 - 学生列表
  • 案例3：进销存管理系统 - 顾客列表

化简模板的原则

• 解耦：把模板组件按功能拆分开，没有必要组合在一起
  • 新增、修改、删除的表格和对话框，从数据表格里拿出来
• 不同的功能，尽量不共用一个组件
  • 新增与修改的表格分开

认识模板里的重要组件：

• 数据表格：
• 插槽：v-slot
• 对话框：
• 输入框：
• 按钮：

作业

• 照着演示，自己动手做一遍
• 读文档，学习重要的组件
• 总结化简代码的原则
• 总结模板代码包含哪几部分
• 尝试魔改代码