零基础,一周内基于Vue3写出一个CURD系统

简介: 零基础,一周内基于Vue3写出一个CURD系统

总体效果展示

https://www.bilibili.com/video/BV1EF411878j?t=34.7

基础Vue3的CURD模拟系统

技术及知识点

  • 涉及的技术: Vue3+Element-Plus +CSS3 +JS
  • 开发工具: WebStorm
  • 涉及的前端知识:Flex布局,CSS样式调试,debugger调试,axios异步http接口调用
  • 涉及的VUE3知识:兄弟组件传参,变量监听,面包屑路由控制,钩子函数,插槽,reactive、ref、toRef的应用
  • 涉及的Element-Plus控件:Breadcrumb 面包屑,Icon 图标,Switch 开关,Table 表格,Message 消息提示,Dialog 对话框,Pagination 分页,Divider 分割线,Tree 树形控件,DateTimePicker 日期时间选择器,

具体界面

博主总结

接下来会根据每个不同的模块进入更深一步的知识学习和博客总结。在此之前先谈谈一些软性的东西压力管理,以下内容摘自某学习圣经:

在你的表现训练里, 掌握这个领域的第一步就是要练习面对和释放压力两者间的此消彼长。 这可能会涉及我前面说过的间歇性训练, 什么样的难度对每个不同的年龄, 身体状况是合适的。 这种训练, 当然, 可以有多种形式: 我已经说过自行车和阻力练习, 但如果你喜欢在游泳池里循环游泳, 你不必一直游到筋疲力尽, 然后退场, 你应该把自己推向体力的限,然后休息一两分钟, 之后再继续把自己向前推进。 就像我在自行车训练中描述的那样, 制定一个有规律的休息间隔。 随着你的练习, 增加你运动的强度和持续时间, 慢慢压缩休息的时间, 你就步入正轨了! 相同的方法可以运用于慢跑、 举重、 武术训练或是其他任何体育项目。

如若你确实想提高表现, 我建议你把面对和恢复压力的节奏糅入你生活的方方面面。 说实话, 这就是我全部学习方法的根基——打破我们人生种种经历中人为制造的障碍, 那么所有的时刻都因相互间的关联而变得丰富多彩。 若你在读书而已目光涣散, 把书放下, 深呼吸, 拿起书, 立即双眼有神。 若你在工作中发现自己大脑呆滞, 没有活力, 休息

一会, 洗把脸, 回来就面目全新。 一天花几分钟做一些简单的思维的练习, 随着一呼一吸, 大脑也一张一弛, 这可是个不错的主意。 这将帮助你把身体的间歇性训练和大脑的运转联系起来。 若你对这样的经历乐在其中, 你会慢慢地建立起自己的精神活力, 并乐意在此花更多的时间。


相关文章
|
22天前
|
存储 JavaScript 前端开发
vue3的脚手架模板你真的了解吗?里面有很多值得我们学习的地方!
【10月更文挑战第21天】 vue3的脚手架模板你真的了解吗?里面有很多值得我们学习的地方!
vue3的脚手架模板你真的了解吗?里面有很多值得我们学习的地方!
|
25天前
|
API
vue3知识点:provide 与 inject
vue3知识点:provide 与 inject
31 4
vue3知识点:provide 与 inject
|
25天前
|
API
vue3知识点:readonly 与 shallowReadonly
vue3知识点:readonly 与 shallowReadonly
25 1
vue3知识点:readonly 与 shallowReadonly
|
19天前
|
JavaScript 前端开发 开发者
Vue 3中的Proxy
【10月更文挑战第23天】Vue 3中的`Proxy`为响应式系统带来了更强大、更灵活的功能,解决了Vue 2中响应式系统的一些局限性,同时在性能方面也有一定的提升,为开发者提供了更好的开发体验和性能保障。
44 7
|
20天前
|
前端开发 数据库
芋道框架审批流如何实现(Cloud+Vue3)
芋道框架审批流如何实现(Cloud+Vue3)
39 3
|
19天前
|
JavaScript 数据管理 Java
在 Vue 3 中使用 Proxy 实现数据双向绑定的性能如何?
【10月更文挑战第23天】Vue 3中使用Proxy实现数据双向绑定在多个方面都带来了性能的提升,从更高效的响应式追踪、更好的初始化性能、对数组操作的优化到更优的内存管理等,使得Vue 3在处理复杂的应用场景和大量数据时能够更加高效和稳定地运行。
38 1
|
19天前
|
JavaScript 开发者
在 Vue 3 中使用 Proxy 实现数据的双向绑定
【10月更文挑战第23天】Vue 3利用 `Proxy` 实现了数据的双向绑定,无论是使用内置的指令如 `v-model`,还是通过自定义事件或自定义指令,都能够方便地实现数据与视图之间的双向交互,满足不同场景下的开发需求。
40 1
|
21天前
|
前端开发 JavaScript
简记 Vue3(一)—— setup、ref、reactive、toRefs、toRef
简记 Vue3(一)—— setup、ref、reactive、toRefs、toRef
|
22天前
Vue3 项目的 setup 函数
【10月更文挑战第23天】setup` 函数是 Vue3 中非常重要的一个概念,掌握它的使用方法对于开发高效、灵活的 Vue3 组件至关重要。通过不断的实践和探索,你将能够更好地利用 `setup` 函数来构建优秀的 Vue3 项目。
|
25天前
|
JavaScript Java API
vue3知识点:setup
vue3知识点:setup
28 5