Question

我开始使用vue.js，对于我的项目，我看到需要使用vue.js官方网站中的以下select2包装器组件，这是链接：{{3 }}问题是我现在需要发出一个根事件来更改select2的值，这就是为什么它在以下部分中添加一行代码：

.on('change', function () {
  vm.$emit('input', this.value);
  vm.$root.$emit('eventing', this.value);
})

这可行，但是我从vue控制台意识到，我的事件被广播了两次，我以为是我的代码问题，删除了添加的行，但是输入事件也被发出了两次，我的问题是：这是正常行为吗？这样做不好吗？我缺少一些东西。对我来说，这是一个发出两次的问题，因为自从我进行活动以来，我正在进行ajax调用，并且两次执行相同。

Answer 1

有一种使用vue将数据绑定到select2的简单方法：

Vue.directive('select', {
  twoWay: true,
  bind: function (el, binding, vnode) {
      $(el).select2().on("select2:select", (e) => {
        // v-model looks for
        //  - an event named "change"
        //  - a value with property path "$event.target.value"
        el.dispatchEvent(new Event('change', { target: e.target }));
    });
  },
 });

此绑定到Vue实例上的所有选择，以便它们与v模型一起使用，您可以使用select2

然后，将v-model =“”和v-select =“”添加到select2定位的目标对象中，然后进行设置。

信用至：Select2 on change event is not working in Vuejs

Answer 2

尝试在销毁前关闭...

beforeDestroy() {
  this.$root.$off('change', yourFunction)
},

this。$ root。$ emit两次运行事件

2 个答案: