最新公告
  • 欢迎您光临666资源站,全网唯一域名:666java.com
  • 基于Vue3+Vite+TS,二次封装element-plus业务组件|完结无秘

    基于Vue3+Vite+TS,二次封装element-plus业务组件|完结无秘 最后编辑:2022-08-22
    资源介绍: 网盘在线学习 一手资源 包更新 资料齐全超清画质mp4格式

    课程简介:

    很多前端开发者只会调用element-plus组件库已有组件,在面对需要定制的场景,或者想要简化使用组件的时候,就会无从下手。本课程深度结合前沿技术栈Vue+Vite+TS,全方位讲解二次封装的思想、技巧、组件设计等,并提供了大量封装实例,帮大家掌握组件的二次封装,实现前端进阶!

    百度云截图:

    目录:

    • 第1章 课程简介2 节 | 24分钟

      本章节简单介绍课程最终效果,技术选型,学习目标及学习收获。

      收起列表

      • 视频:1-1 导学 (17:58)
      • 视频:1-2 二次封装的意义 (05:36)
    • 第2章 封装组件初级篇(上)16 节 | 115分钟

      本章节会实现一些基础功能组件,意在讲解封装组件的技巧和组件设计思想,包括如何定义视图,定义数据和定义事件,为后续难度升级做好准备。

      收起列表

      • 图文:2-1 本章概述
      • 视频:2-2 搭建vite项目并配置路由和element-plus (09:17)
      • 视频:2-3 全局注册图标 (07:43)
      • 视频:2-4 伸缩菜单-完成伸缩菜单基本功能 (10:55)
      • 视频:2-5 伸缩菜单-抽离头部和侧边栏组件并完善伸缩菜单 (08:22)
      • 视频:2-6 图标选择器-巧用两次watch控制弹框的显示与隐藏 (16:55)
      • 视频:2-7 图标选择器-巧用component动态组件显示所有的图标 (09:47)
      • 视频:2-8 图标选择器-利用命名空间修改dialog样式 (07:41)
      • 视频:2-9 图标选择器-通过自定义 hooks 函数实现复制功能 (06:52)
      • 视频:2-10 省市区选择组件-利用 github 获取到省市区数据 (09:39)
      • 视频:2-11 省市区选择组件-巧用 watch 来达到三级联动效果 (11:26)
      • 视频:2-12 省市区选择组件-完善省市区联动组件并给父组件分发事件 (09:51)
      • 视频:2-13 利用app.use特性全局注册组件 (06:02)
      • 作业:2-14 扩展一个省市区街道四级联动组件
      • 作业:2-15 扩展一个级联选择框的省市区组件
      • 图文:2-16 本章回顾
    • 第3章 封装组件初级篇(下)11 节 | 91分钟

      本章节会实现一些基础功能组件,意在讲解封装组件的技巧和组件设计思想,包括如何定义视图,定义数据和定义事件,为后续难度升级做好准备。

      收起列表

      • 图文:3-1 本章概述
      • 视频:3-2 趋势标记-图标的组合使用实现上升下降趋势 (14:27)
      • 视频:3-3 趋势标记-动态绑定class的妙用实现颜色反转 (09:17)
      • 视频:3-4 趋势标记-计算属性的妙用实现文字颜色 (09:46)
      • 视频:3-5 通知菜单-icon和badge组件的组合使用 (10:22)
      • 视频:3-6 通知菜单-封装一个列表组件(上) (13:42)
      • 视频:3-7 通知菜单-封装一个列表组件(下) (27:26)
      • 视频:3-8 通知菜单-完善list组件并融合进通知菜单 (05:45)
      • 图文:3-9 给趋势标记增加自定义文字大小功能
      • 图文:3-10 给通知菜单添加禁用状态
      • 图文:3-11 本章回顾
    • 第4章 封装组件中级篇16 节 | 206分钟

      本章节会通过四个复杂组件来深入组件封装的技巧和思想,当遇到复杂需求时,如何利用现有组件实现更多功能。

      收起列表

      • 视频:4-1 导航菜单-导航菜单的需求分析和数据设计 (11:12)
      • 视频:4-2 导航菜单-巧用 template 实现两级结构的菜单 (11:41)
      • 视频:4-3 导航菜单-使用 tsx 实现无限层级菜单 (17:35)
      • 视频:4-4 导航菜单-利用封装好的导航菜单组件改造项目整体结构 (07:49)
      • 视频:4-5 导航菜单-完善细节并增加自定义键名功能 (11:24)
      • 视频:4-6 进度条-完成进度条动态加载效果 (13:04)
      • 图文:4-7 给进度条组件加上进度完成事件
      • 视频:4-8 时间选择组件-完成时间选择组件的全部功能 (19:16)
      • 视频:4-9 时间选择组件-完成日期选择组件所有功能 (17:10)
      • 视频:4-10 时间选择组件-修复日期选择组件结束日期未清空问题 (01:29)
      • 视频:4-11 城市选择组件-组合式使用组件完成基本布局 (21:49)
      • 视频:4-12 城市选择组件-获取城市数据并显示所有城市 (15:43)
      • 视频:4-13 城市选择组件-绑定事件并实现点击字母跳转到对应区域 (12:04)
      • 视频:4-14 城市选择组件-完善按省份选择城市 (23:04)
      • 视频:4-15 城市选择组件-使用 filter-method 实现搜索过滤 (21:53)
      • 图文:4-16 本章回顾
    • 第5章 封装组件高级篇(上)19 节 | 177分钟

      本章节将对表单,这个在平时业务当中用的最多并且最重要的两个组件进行二次封装,也是本次课程难度最大,课程中将展现更多组件封装技巧,特别是对复杂组件的处理。

      收起列表

      • 图文:5-1 本章概述
      • 视频:5-2 表单组件-一个强大的表单组件应该具备哪些功能 (09:58)
      • 视频:5-3 表单组件-使用ts定义表单配置项的数据类型 (12:27)
      • 视频:5-4 表单组件-使用配置的数据完成一个基本版表单 (18:09)
      • 视频:5-5 表单组件-巧用component动态组件配置添加子元素组件 (19:43)
      • 视频:5-6 表单组件-单独处理上传组件-1 (19:10)
      • 视频:5-7 表单组件-单独处理上传组件-2 (14:46)
      • 视频:5-8 表单组件-巧用插槽给表单加上操作项 (14:39)
      • 视频:5-9 表单组件-完善表单上传逻辑 (06:46)
      • 视频:5-10 表单组件-集成富文本编辑器 wangeditor (13:34)
      • 视频:5-11 表单组件-完善表单重置逻辑 (08:12)
      • 视频:5-12 表单组件-弹出框表单的基本结构 (11:08)
      • 视频:5-13 表单组件-使用defineExpose获取表单实例方法 (15:26)
      • 视频:5-14 表单组件-完善表单逻辑 (08:37)
      • 视频:5-15 表单组件-表单组件总结 (03:44)
      • 图文:5-16 拓展动态添加和删除表单
      • 图文:5-17 为表单增加自定义验证规则
      • 图文:5-18 为表单增加剩余实例方法
      • 图文:5-19 本章回顾
    • 第6章 封装组件高级篇(下)15 节 | 118分钟

      本章节将对表格,这个在平时业务当中用的最多并且最重要的两个组件进行二次封装,课程中将展现更多组件封装技巧,特别是对复杂组件的处理。

      收起列表

      • 图文:6-1 本章概述
      • 视频:6-2 表格组件-一个强大的表格应该具备哪些功能 (06:30)
      • 视频:6-3 表格组件-使用 ts 定义表格组件需要的类型 (05:51)
      • 视频:6-4 表格组件-通过配置的数据完成一个基础版表格 (05:59)
      • 视频:6-5 表格组件-巧用插槽实现操作项和自定义列数据 (15:28)
      • 视频:6-6 表格组件-为表格加上loading效果 (09:18)
      • 视频:6-7 表格组件-实现可编辑单元格功能 (29:11)
      • 视频:6-8 表格组件-实现可编辑行功能-1 (12:24)
      • 视频:6-9 表格组件-实现可编辑行功能-2 (09:48)
      • 视频:6-10 表格组件-修复冒泡事件带来的问题 (03:49)
      • 视频:6-11 表格组件-实现表格分页功能 (19:17)
      • 图文:6-12 拓展表格排序功能
      • 图文:6-13 拓展表格单选功能
      • 图文:6-14 拓展表格多选功能
      • 图文:6-15 本章回顾
    • 第7章 封装组件拓展篇8 节 | 49分钟

      本章节将会选择fullcalendar作为日历基础组件,将fullcalendar封装成一个高拓展性的日历组件。

      收起列表

      • 图文:7-1 本章概述
      • 视频:7-2 日历组件-element-plus日历组件的不足和为何选择fullcalendar来二次封装 (06:29)
      • 视频:7-3 日历组件-使用fullcalendar配置生成日历 (10:21)
      • 视频:7-4 日历组件-日历的事件渲染和点击事件处理 (16:56)
      • 视频:7-5 日历组件-自定义渲染日历内容 (10:12)
      • 视频:7-6 修复组件出现的样式问题 (04:03)
      • 图文:7-7 将日历语言改成英文显示
      • 图文:7-8 日历自定义渲染内容使开始时间和结束时间字体都变成红色
    • 第8章 使用vuepress 编写组件文档21 节 | 230分钟

      本章节将会使用vuepress来为组件库编写组件文档。

      收起列表

      • 图文:8-1 本章概述
      • 视频:8-2 实现组件的全量打包 (13:08)
      • 视频:8-3 单独打包每个组件实现按需引入 (14:46)
      • 视频:8-4 发布组件库到 npm (16:03)
      • 视频:8-5 如何更新已经发布的组件库版本 (08:02)
      • 视频:8-6 如何在 github 部署预览项目 (09:54)
      • 视频:8-7 如何在码云部署预览项目 (08:34)
      • 视频:8-8 组件库文档首页编写 (07:59)
      • 视频:8-9 编写文档网站头部导航和侧边导航 (14:23)
      • 视频:8-10 集成组件库并添加显示和交互 (10:42)
      • 视频:8-11 编写组件库文档的快速上手 (11:27)
      • 视频:8-12 完善组件库所有组件说明(1) (14:47)
      • 视频:8-13 完善组件库所有组件说明(2) (16:04)
      • 视频:8-14 完善组件库所有组件说明(3) (21:21)
      • 视频:8-15 完善组件库所有组件说明(4) (07:27)
      • 视频:8-16 完善组件库所有组件说明(5) (24:38)
      • 视频:8-17 完善组件库所有组件说明(6) (26:13)
      • 视频:8-18 完善组件库文档介绍 (03:47)
      • 图文:8-19 给文档增加自己github和码云仓库地址
      • 图文:8-20 给文档增加自定义logo
      • 图文:8-21 本章回顾

    猜你喜欢

    猜你在找

    免责声明: 1、本站信息来自网络,版权争议与本站无关 2、本站所有主题由该帖子作者发表,该帖子作者与本站享有帖子相关版权 3、其他单位或个人使用、转载或引用本文时必须同时征得该帖子作者和本站的同意 4、本帖部分内容转载自其它媒体,但并不代表本站赞同其观点和对其真实性负责 5、用户所发布的一切软件的解密分析文章仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。 6、您必须在下载后的24个小时之内,从您的电脑中彻底删除上述内容。 7、请支持正版软件、得到更好的正版服务。 8、如有侵权请立即告知本站(邮箱:666java@sina.com,备用微信:java666vip),本站将及时予与删除 9、本站所发布的一切破解补丁、注册机和注册信息及软件的解密分析文章和视频仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑中彻底删除上述内容。如果您喜欢该程序,请支持正版软件,购买注册,得到更好的正版服务。如有侵权请邮件与我们联系处理。
    666资源站 » 基于Vue3+Vite+TS,二次封装element-plus业务组件|完结无秘

    常见问题FAQ

    视频格式是什么?
    不加密,网盘在线学习
    怎么发货?
    自动发货,提供百度云链接和提取码【如失效点击网站右侧联系客服】】
    有些资源没更新完结怎么办?
    本站资源包更新至完结,后续可以点击链接获取
    有问题不懂的怎么办
    咨询邮箱:666java@sina.com 备用微信:java666vip
    • 24748会员总数(位)
    • 32861资源总数(个)
    • 4本周发布(个)
    • 0 今日发布(个)
    • 2802稳定运行(天)

    最专业的it资源平台

    加入我们
  • © 2012 666资源站 All rights reserved |
  • 升级SVIP尊享更多特权立即升级