Javascript 如何反应式扩展Vue.prototype

我想写一个简单的插件。这是一个向任何元素添加涟漪效应的指令。到目前为止，custom指令工作正常（检查），但我想向Vue实例添加一些数据，以便用户可以全局修改一些值。我希望它能像这样使用

new Vue({
  ripple: {
    color: '#f18c16'
  }
})

这将修改本例中所有ripple指令的颜色。据我所知，这是没有文档记录的，所以我检查了一些Vue插件中的一个litle，然后找到了这段代码

const ripple = {
    color: '#000'
}
const init = Vue.prototype._init

Vue.prototype._init = function(options) {
    options = options || {}
    Vue.util.defineReactive(this, '$ripple', ripple)
  init.call(this, options)
}

在我的指令中，我是这样使用的

  if (this.modifiers.white) {
    point.style['background-color'] = '#fff'
  } else {
    point.style['background-color'] = this.vm.$ripple.color
  }

---

但这只会将

$ripple

属性添加到我的Vue实例中，并且我期望的声明不起作用。检查。因此，我的问题是如何使用为我的指令定义的

ripple

选项？是否有任何官方/标准的方法可以做到这一点？

您不需要定义反应性

简单地说：

this.vm.$options.ripple.color

与此相反：

this.vm.$ripple.color