自定义指令 · 插件封装
🎯 30章
完整进阶
01
指令初探
什么是自定义指令
内置指令回顾
应用场景
进入章节
02
指令注册
全局 vs 局部
命名规范
钩子函数
进入章节
03
钩子函数详解
bind
inserted
update
componentUpdated
unbind
进入章节
04
指令参数
el / binding
vnode / oldVnode
binding属性
进入章节
05
动态指令参数
方括号语法
v-myDirective:[argument]
动态绑定
进入章节
06
指令修饰符
自定义修饰符
处理逻辑
结合动态参数
进入章节
07
v-focus 指令
自动聚焦
动态表单
input 控制
进入章节
08
v-permission 指令
按钮权限
后端权限列表
控制粒度
进入章节
09
v-debounce 指令
防抖输入
防止频繁请求
延迟触发
进入章节
10
v-throttle 指令
节流按钮
防止重复提交
时间控制
进入章节
11
v-lazy 指令
图片懒加载
IntersectionObserver
性能优化
进入章节
12
v-copy 指令
一键复制
Clipboard API
兼容处理
进入章节
13
v-longpress 指令
长按事件
区分点击
触发阈值
进入章节
14
v-draggable 指令
元素拖拽
边界吸附
自由移动
进入章节
15
v-watermark 指令
页面水印
防截图
自定义文案
进入章节
16
v-ellipsis 指令
多行省略
计算行高
溢出处理
进入章节
17
v-emoji 指令
禁止表情
输入过滤
正则控制
进入章节
18
v-ripple 指令
水波纹效果
Material Design
点击反馈
进入章节
19
v-infinite 指令
滚动加载
滚动容器
触底加载
进入章节
20
v-skeleton 指令
骨架屏
加载占位
用户体验
进入章节
21
插件概念
什么是插件
作用与场景
Vue.use
进入章节
22
插件开发
install 方法
全局方法/属性
添加指令
进入章节
23
插件混入
mixin 注入
生命周期钩子
逻辑复用
进入章节
24
插件提供实例方法
Vue.prototype
全局挂载
$方法
进入章节
25
插件封装
打包指令
统一导出
插件结构
进入章节
26
插件配置
选项参数
自定义配置
默认值合并
进入章节
27
插件发布
npm 发布流程
package.json
README编写
进入章节
28
插件测试
单元测试
@vue/test-utils
指令逻辑
进入章节
29
插件文档
Storybook
Vitepress
文档生成
进入章节
30
综合实战
完整指令插件库
发布到 npm
项目整合
进入章节