首页 文章

Vue JS在要填充的选择中设置第一项

提问于
浏览 次
0

我有一个HTML选择，预先填充了服务器的选项 . 当我使用v-model时，它会在页面加载时选择一个空选项而不是第一个选项 .

我发现下面的帖子是一个可能的解决方案，但是，数据是从服务器填充的，所以我不知道第一个选项是什么 .

Vue selected first option with v-model

<select id="group" v-model="group">
  <option value="Color">Color</option>
  <option value="Size">Size</option>
</select>
javascript html vue.js vuejs2

2 回答

  • 0

    经过一番挖掘，我找到了答案：

    HTML：

    <select id="group" ref="groupSelect" v-model="group">
  <option value="Color">Color</option>
  <option value="Size">Size</option>
</select>

    JS：

    mounted: function() {
  var groupSelect = this.$refs.groupSelect.children;

  if (groupSelect.length) {
    this.group = groupSelect[0].value;
  }
}
    回复于
  • 0

    看到这个JS小提琴：https://jsfiddle.net/eywraw8t/147653/

    在这种情况下，您可以使用 watcher 检查选项列表是否已更改，从中可以根据第一个选项的值为组分配默认值 .

    回复于

相关问题