从VUEJS 2.0指令设置模型值

Question

我正在使用VUE 2.0指令将Twitter打字到输入。我已经能够以某种方式将其应用于VUE模型，从而将值应用回VUE模型，通过循环浏览上下文，找到父对象并调用我的方法setAutocmpleteValue()

vue自定义指令的html设置

    <input class="typeahead" type="text" placeholder="Search" name='typeahead'
        v-typeahead="getFieldValues(part.fieldName)"  
        v-model="part.value" v-bind:value="part.value"
        v-on:change="updateTest()" @input="onValidChange()" />

自定义指令

Vue.directive('typeahead', {
    inserted:  function(el_, binding,v) {
         // this feels like a hack, is there a better way?
         v.context._self.parent.setAutocmpleteValue('test');
     }
})

在指令$内部无法通过事件，有没有更好的方法来致电setAutocmpleteValue()？

Answer 1

在VUE 2中，指令用于DOM操作。

请注意，在VUE 2.0中，代码重用和抽象的主要形式是组件 - 但是在某些情况下，您只需要一些平原元素上的低级DOM访问，这是自定义的地方指令仍然有用。

它们不打算设置数据值，并且尝试这样做的尝试将依赖于您所使用的黑客。

不仅如此，而且这是一种非常脆弱的方法。问题中的指示取决于当前上下文的父母中的一种方法。如果输入元素是两个级别下降或更多？

您最好实现组件。

但是，鉴于您已经被黑客入侵，$ emit可从 context.

获得。

v.context.$emit("some-event", someData)

context是包含您已附加到指令的元素的VUE或VUE组件，因此您需要从该组件的父母那里收听。