vue自定义函数虚拟真实dom问题

Question

vue 自定义指令 为什么可以拿到真实dom参数啊 他不是还在虚拟dom吗

Answer 1

在 Vue 中，自定义指令的 bind、inserted、update 和 componentUpdated 四个钩子函数中，第一个参数 el 表示指令所绑定的元素，它是真实的 DOM 元素，而不是虚拟 DOM。当 Vue 编译模板时，会将模板转换为虚拟 DOM，然后通过虚拟 DOM 更新真实 DOM，这个过程中会执行自定义指令的钩子函数。

在自定义指令的钩子函数中，可以通过 el 参数访问到真实的 DOM 元素，因为 Vue 在执行钩子函数时已经将虚拟 DOM 转换为真实 DOM 并插入到页面中。所以，自定义指令可以拿到真实 DOM 参数。