Javascript 更改时选择2事件在Vuejs中不起作用

我在vuejs中使用select2，发现vuejs没有使用jquery select2，因为vuejs正在使用navite html

我正在使用这个代码

Vue.指令“select”{ 双向：对， 绑定：函数{ $this.el.select2 .onselect2：选择，函数E{ this.set$this.el.val； }.这一点； }, 更新：functionnv，ov{ $this.el.triggerchange； } }; var app=新的Vue{ el:“应用程序”， 数据：{ 供应商编号：niklesh } } $'supplier_id'。选择2{}； {{supplier_id}} 阿图尔 尼克莱什 萨钦

---

通过将select2值指定给vuejs数据，我可以解决此问题。我在这里没有使用自定义指令

var app=新的Vue{ el:“应用程序”， 数据：{ 供应商编号：niklesh }, 过滤器：{ 大写：函数值{ 如果！返回值 value=value.toString 返回值.charAt0.toUpperCase+value.1 } } }; $'supplier\u id'。一旦更改，函数{ app.supplier_id=$this.val； console.log'Name:'+$this.val； }; $'supplier_id'。选择2{}； 名称：{{supplier_id | capitalize}} 阿图尔 尼克莱什 萨钦

---

为了让它与指令一起工作，我们需要了解v-model是如何工作的。从：

{{supplier_id}} 阿图尔 尼克莱什 萨钦 尝试在选择控件中添加v-on:change=onChange

HTML模板

---

1分钟前询问并回答？@darryn.ten:这是我自己的答案，虽然它通过jquery工作，但如果我能通过vuejs解决这个问题，那就太好了。@Rishi:我认为这不是一个糟糕的解决方案，但您最初使用指令的想法似乎更易于重用。我添加了一个解决方案，展示了如何使用指令。通过解释指令的工作原理以及为什么它比公认的答案更好，可以改进此答案。这是最简单的解决方案。谢谢。谢谢你的解决方案！我使用的是multi-select，因此我还必须在select2:unselect上触发更改事件，如：$el.select2.onselect2:select2:unselect，e=>{这似乎不适用于Vue3。知道为什么吗？@e4rthdog指令在Vue3中的工作方式不同。我为Vue3添加了一个代码段。

<input v-model="something">

<input v-bind:value="something" v-on:input="something = $event.target.value">

<select v-model="selected">
       <option value="1">1</option>
       <option value="2">2</option>
       <option value="3">3</option>
</select>


const self = this;
$("select").change(function () {
        const val = $(this).find("option:selected").val();
        self.selected = val;
 });

<select id="supplier_id" class='form-control' 
v-model='supplier_id' v-select='supplier_id' v-on:change="onChange">
    <option value="atul">Atul</option>
    <option value="niklesh">Niklesh</option>
    <option value="sachin">Sachin</option>
</select>

methods: {
  onChange(e) {        
      alert("Change");   
  }
}