Vue v-model 不会通过第三方下拉菜单触发

Question

我的选择元素定义为

<select v-model="mySelectValue">
    <option v-for=...>...</option>
</select>

如果按原样使用，则当用户更改选择输入时，mySelectValue可以正确更新。

现在我想设置输入。我尝试了selectize.js：

$('select').selectize();

选择输入现在使用新的外观和功能，但是更改值不会更新mySelectValue。我认为原始的选择输入将通过selectize.js进行更新，因此我尝试了下拉列表。同样的事情。

使用jQuery我将on on on on on on Change侦听器连接到原始选择输入：

$('#mySelect').change(function() { 
    console.log($(this).val()); 
});

使用这两个库中的任何一个，我看到了触发的更改事件，并且原始选择输入已更新。

为什么不更新mySelectValue？

Answer 1

您应该将值属性添加到<option>

<select v-model="mySelectValue">
   <option value='1'>one</option>
   <option value='2'>two</option>
   <option value='3'>three</option>
</select>