Question

当用户第一次访问网站时，我无法为myselect设置默认值。我希望选择第一个选项，但是如果用户不想要默认选项，则可以更改他的选择并选择其他选项。我使用v-model时可以这样做吗？

这是我的HTML代码：

<div class="form-group">
    <label class="control-label" for="docType">Type of document</label>
    <select class="form-control" id='docType' name="docType" v-model="docType"
            :disabled="noDocChoose == true">
        <option value="paragon">Document1</option>
        <option value="complaint">Document2</option>
    </select>
</div>

这是我的Vue JS代码：

data: () => ({
    docType: ''
}),

Answer 1

将数据中的docType设置为您想要的默认值。

data(){
  return {
    docType: "paragon"
  }
}

实施例

＆＃13;

console.clear()

new Vue({
  el: ".form-group",
  data(){
    return {
      docType: "paragon"
    }
  }
})

＆＃13;

<script src="https://unpkg.com/vue@2.4.2"></script>
<div class="form-group">
  <label class="control-label" for="docType">Type of document</label>
  <select class="form-control" id='docType' name="docType" v-model="docType" :disabled="noDocChoose == true">
                    <option value="paragon">Document1</option>
                    <option value="complaint">Document2</option>
                </select>
</div>

＆＃13;

Answer 2

您是否在询问是否可以使select具有空的默认值？在这种情况下，您必须添加另一个具有空值的选项。例如：

class CPage : public QAbstractListModel

将选择与docType模型匹配的选项的值。

Vue选择了v-model的第一个选项

2 个答案: