Vue 2是否移除了自定义指令的params与paramWatchers特性？

关于params和paramWatchers特性 #

Vue 2.x（包括2.7版本）已完全移除Vue 1.x中的params和paramWatchers API，这两个特性不再存在于Vue的官方实现中，也无隐藏替代入口。

替代方案（仅基于指令实现） #

针对update钩子频繁触发的问题，提供两种精准解决方案：

方案1：缓存属性值，仅在变化时执行逻辑 #

利用bind钩子初始化缓存，在update中对比当前值与缓存值，仅当属性真正变化时执行业务逻辑：

const myDirective: DirectiveOptions = {
  bind(el: any) {
    // 将初始属性值缓存到元素实例上
    el._cachedCustomAttr = el.getAttribute('customAttribute')
  },
  update(el: any) {
    const currentAttr = el.getAttribute('customAttribute')
    // 仅当属性值发生变化时执行操作
    if (currentAttr !== el._cachedCustomAttr) {
      doSomething(currentAttr)
      el._cachedCustomAttr = currentAttr
    }
  }
}

该方案通过简单缓存对比，避免update钩子触发时的重复执行，无需额外状态管理。

方案2：使用原生MutationObserver监听属性变化 #

通过原生DOM的MutationObserver API，精准监听目标元素的指定属性变化，完全脱离Vue更新周期，不会因父组件更新触发不必要回调：

const myDirective: DirectiveOptions = {
  bind(el: any) {
    // 创建观察者实例，指定回调逻辑
    const attrObserver = new MutationObserver((mutations) => {
      mutations.forEach(mutation => {
        // 仅处理目标属性的变化（DOM属性名统一为小写）
        if (mutation.attributeName === 'customattribute') {
          const currentAttr = el.getAttribute('customAttribute')
          doSomething(currentAttr)
        }
      })
    })

    // 配置监听规则：仅监听指定属性
    attrObserver.observe(el, {
      attributes: true,
      attributeFilter: ['customAttribute']
    })

    // 将观察者实例缓存到元素上，用于销毁时清理
    el._attrObserver = attrObserver
  },
  unbind(el: any) {
    // 销毁观察者，避免内存泄漏
    if (el._attrObserver) {
      el._attrObserver.disconnect()
      delete el._attrObserver
    }
  }
}

该方案精准度更高，仅在目标属性的DOM值真正变化时触发逻辑，适合性能要求较高的场景。

内容的提问来源于stack exchange，提问作者Tharaka Deshan