正如 Headers 所说,我使用他们页面中的示例为VueJS 1.0.15注册了Select2指令 . 我想捕捉@change事件,但它不起作用 .
HTML:
<select v-select="item.service" :selected="item.service" @change="serviceChange(item)">
<option value="1">test 1</option>
<option value="2">test 2</option>
</select>
JS:
Vue.directive('select', {
twoWay: true,
params: ['selected'],
bind: function () {
var self = this
$(this.el)
.select2({
minimumResultsForSearch: Infinity
})
.val(this.params.selected)
.on('change', function () {
console.log('changed');
self.set(this.value);
})
},
update: function (value) {
$(this.el).val(value).trigger('change')
},
unbind: function () {
$(this.el).off().select2('destroy')
}
});
var Checkout = new Vue({
el: '.Checkout',
methods: {
serviceChange: function (item) {
console.log(item);
},
}
});
4 回答
你不应该使用$ emit吗?
是的,我遇到了这个问题 . 尚未找到解决方案,但这是我目前的工作轮次使用
watch
:在你的VueJS中:
然后在你的HTML中:
注意:在上面的HTML中,
{{ $peopleJSON }}
就是我使用Blade模板引擎插入服务器端JSON的方式 . 与这个问题不太相关 .我最近在尝试将select2结果绑定到vuejs数据模型对象时出现问题,并且我提供了一种解决方法,它可能对您有所帮助:
https://jsfiddle.net/alberto1el/7rpko644/
我知道你正在使用指令,但也许它可以帮助你
扩展到Alberto Garcia的回答 .