前端知库

Vue 自定义指令适合什么场景?

参考答案

自定义指令主要复用普通元素上的底层 DOM 操作,例如聚焦、集成观察器或对接第三方 DOM 工具。组件更适合封装界面结构,组合式函数更适合复用有状态逻辑,不应把全部业务都塞进指令。

指令可以通过 mounted、updated、unmounted 等钩子访问绑定元素,并读取绑定值。注册事件、观察器或其他资源时,要在适当生命周期释放;更新时应处理新旧值,避免重复注册和互相覆盖。

Vue 官方不推荐把自定义指令直接用在组件上,因为它依赖组件根节点,多根组件会有问题。指令不能自动跨越组件边界选择正确内部元素,也不应绕开响应式状态去随意修改由模板管理的内容。