首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >Vue选中第一个带有v-model的选项

Vue选中第一个带有v-model的选项
EN

Stack Overflow用户
提问于 2017-09-28 00:02:03
回答 2查看 4.7K关注 0票数 0

当用户第一次访问站点时,我无法为myselect设置默认值。我想有第一个选项作为选择,但用户可以改变他的选择和选择另一个选项,如果他不想默认的选项。当我使用v-model时,我可以这样做吗?

下面是我的HTML代码:

代码语言:javascript
复制
<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代码:

代码语言:javascript
复制
data: () => ({
    docType: ''
}),
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2017-09-28 00:08:17

将数据中的docType设置为您希望成为默认值的值。

代码语言:javascript
复制
data(){
  return {
    docType: "paragon"
  }
}

举例说明。

代码语言:javascript
复制
console.clear()

new Vue({
  el: ".form-group",
  data(){
    return {
      docType: "paragon"
    }
  }
})
代码语言:javascript
复制
<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>

票数 1
EN

Stack Overflow用户

发布于 2017-09-28 00:17:02

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

代码语言:javascript
复制
    <select class="form-control" id='docType' name="docType" v-model="docType">
      <option value="">- please select -</option>
      <option value="paragon">Document1</option>
      <option value="complaint">Document2</option>
    </select>

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

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/46452415

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档