Javascript VueJS Select2指令不'；t火灾@变更事件

正如标题所述，我使用他们页面上的示例为VueJS 1.0.15注册了Select2指令。 我想捕捉@change事件，但它不起作用

HTML:

---

你不应该使用$emit吗

update: function (value) {
    $(this.el).val(value);
    this.$emit('change');
}

---

是的，我遇到了这个问题。尚未找到解决方案，但这是我目前使用

watch

进行的一轮工作：

在VueJS中：

watch: {

    /**
     * Watch changes on the select2 input
     *
     * @param integer personId
     */
    'person': function (personId) {
        var personName = $("#person").select2('data')[0].text
        this.doSomethingWithPerson(personId, personName)
    }
},

然后在HTML中：

<select
        id="person"
        v-select2="person"
        class="form-control"
        data-options="{{ $peopleJSON }}"
        data-placeholder="Choose a person"
>
</select>

---

注意：在上面的HTML中，

{{$peopleJSON}}

就是我使用刀片模板引擎插入服务器端JSON的方式。与此问题不太相关。

我最近在尝试将select2结果绑定到vuejs数据模型对象时遇到问题，我提供了一个解决方法，它可能会帮助您：

---

我知道您正在使用指令，但它可能有助于您

进一步了解阿尔贝托·加西亚的答案

var selectDropDown = $(".select-drop-down").select2();

selectDropDown.on('select2:select', function (e) {
    var event = new Event('change');
    e.target.dispatchEvent(event);
});

---

如果你为它设置了一个JSFIDLE，可能会更容易帮助你调试它。这似乎不起作用。我认为$emit在指令上下文中不可用。您基本上是在用watch进行脏检查。您是对的，$emit在指令上下文中不存在谢谢您的解决方案！我使用的是多选，因此我还必须在

select2:unselect

上触发更改事件，例如：

selectDropDown.on（“select2:select2:unselect”，函数（e）{

<select
        id="person"
        v-select2="person"
        class="form-control"
        data-options="{{ $peopleJSON }}"
        data-placeholder="Choose a person"
>
</select>

var search = $(".search").select2({
  ajax: {
    url: "/echo/json",
    dataType: 'json',
    delay: 250,
    data: function (params) {
      return {
        q: params.term
      };
    },
    processResults: function (data, params) {
      var mockResults = [{id: 1,text: "Option 1"}, {id: 2,text: "Option 2"}, {id: 3,text: "Option 3"}];
      return {results: mockResults};
    },
    cache: true
  },
  escapeMarkup: function (markup) { return markup; },
  minimumInputLength: 1
});

search.on("select2:select", function (e){
    $('.result_search').val( $(this).val() ).trigger( 'change' );
});

var vm = new Vue({
  el: "#app",
  data: {
    busqueda_result : ''
  }
});

var selectDropDown = $(".select-drop-down").select2();

selectDropDown.on('select2:select', function (e) {
    var event = new Event('change');
    e.target.dispatchEvent(event);
});