Question

Type.head的Vue.js指令

我正在尝试为Vue Directive功能编写typeahead.js。我能够在typeahead上实例化input form control，并为其分配options和dataset。 Event handling也不是问题。

问题：

现在，我还希望控制typeahead input element中的component。例如，我想从组件中控制这些方法$(el).typeahead('destroy')或$(el).typeahead('open')等。

如何从Component中调用这些方法？有可能吗？

Answer 1

好的，我在输入问题后2分钟就知道了。

我向ref添加input tag。

<!-- bindings is an object which has the "options" and "dataset" -->
<input ref="ttInput" v-typeahead="bindings" />

然后，我在component中添加了一个方法，该方法执行typeahead中的component方法：

...
methods: {
  methodHook (action) {
    const el = this.$refs.ttInput
    $(el).typeahead(action)
  }
}
...

所以，现在，在html template中，我可以拥有button/buttons：

<button type="button" @click="methodHook('open')" >Open</button>
<button type="button" @click="methodHook('close')">Close</button>

像魅力一样。

由于