<template>
<el-select v-model="value4" clearable placeholder="请选择">
<el-option v-for="item in options" :label="item.label" :value="item.value">
</el-option>
</el-select>
</template>

  

data() {
return {
options: [{
value: '选项1',
label: '黄金糕'
}, {
value: '选项2',
label: '双皮奶'
}, {
value: '选项3',
label: '蚵仔煎'
}, {
value: '选项4',
label: '龙须面'
}, {
value: '选项5',
label: '北京烤鸭'
}],
value4: '选项2'
}
}

注意: v-model="value4" 这里的 value4 要和 options 里的 value 保持一致...

来源:https://segmentfault.com/q/1010000008962854

element ui下拉框如何实现默认选择?的更多相关文章

  1. element ui 下拉框绑定对象并且change传多个参数

    废话不说直接上代码说明真相. <template> <div class="hello"> <span>可以设置的属性 value-key=&q ...

  2. paip.web数据绑定 下拉框的api设计 选择框 uapi python .net java swing jsf总结

    paip.web数据绑定 下拉框的api设计 选择框 uapi  python .net java swing jsf总结 ====总结: 数据绑定下拉框,Uapi 1.最好的是默认绑定..Map(k ...

  3. easy ui 下拉框绑定数据select控件

    easy ui 中的下拉框控件叫做select,具体代码如下: html代码:①.这是一个公司等级的下拉框 <tr> <td>公司等级:</td> <td&g ...

  4. layui 根据根据后台数据动态创建下拉框并同时默认选中

        第一步 form表单里写好一个下拉框 <div class="layui-form-item"> <label class="layui-for ...

  5. bootstrap-multiselect.js多选下拉框初始化时默认选中初始值

    bootstrap-multiselect.js多选下拉框默认值设置 一.案例数据格式  二.HTML代码 <select id="msgRoles" multiple=&q ...

  6. c# wpf ComboBox 动态下拉框 及 动态默认值设定

    1.下拉框声明 <ComboBox x:Name="DirComboBox" Width="150" Height="18" Marg ...

  7. 如何在某些情况下禁止提交Select下拉框中的默认值或者第一个值(默认选中的就是第一个值啦……)

    群里有个帅哥问了这么个问题,他的下拉框刚进页面时是隐藏起来的,但是是有值的,为啥呢?因为下拉框默认选中了第一个值呗,,, 所以提交数据的时候就尴尬啦,明明没有选,但是还是有值滴.怎么办呢? 一开始看到 ...

  8. 下拉框数据的动态选择,类似级联ajax刷新数据

    简单的两个下拉列表,第二个中的数据与第一个下拉框相关: --------------------var selected = $(this).children('option:selected').v ...

  9. angular 设置年份选择下拉框,并默认今年

    <select ng-model="selectedYear" ng-change="yearChange(selectedYear)"> < ...

随机推荐

  1. 剑指offer——面试题20:表示数值的字符串

    #include"iostream" using namespace std; bool IsInt(const char **str); bool IsUnsignInt(con ...

  2. 2.6 Rust Slice Type

    字符串操作 fn first_word(s: &String) -> usize { let bytes = s.as_bytes(); for (i, &item) in by ...

  3. 在Vue项目中使用html2canvas生成页面截图并上传

    使用方法 项目中引入 npm install html2canvas html代码 //html代码 <!-- 把需要生成截图的元素放在一个元素容器里,设置一个ref --> <di ...

  4. Python学习 day11

    一.装饰器 装饰器是在不改变函数调用方式的情况下,需要在函数前后新增功能.有些类似aop,不知道原理是否相同,表现是一样的. 装饰器严格遵守了“开放封闭原则” 1.基本装饰器 def wrapper( ...

  5. DBA 需要掌握的知识框架及工作内容

    知识框架 1.  数据库的工作原理以及体系结构 2.  数据库管理(管理数据库和数据库对象) 3.  数据库备份和恢复 4.  数据库故障处理 5.  数据库补丁安装及升级 6.  数据库性能 工作内 ...

  6. selenium IDE 命令 一

    Actions 描述了用户所会作出的操作.Action 有两种形式: action和actionAndWait, action会立即执行,而actionAndWait会假设需要较长时间才能得到该act ...

  7. JDBC(2)-使用statment接口实现增删改操作

    1.Statement接口引入 作用:用于执行静态SQL语句并返回它所生成结果的对象. int executeUpdate(String sql) :执行给定SQL语句,该语句可能为insert.up ...

  8. CVE-2017-6920 Drupal远程代码执行漏洞学习

     1.背景介绍: CVE-2017-6920是Drupal Core的YAML解析器处理不当所导致的一个远程代码执行漏洞,影响8.x的Drupal Core. Drupal介绍:Drupal 是一个由 ...

  9. React+Three.js——PerspectiveCamera透视相机camera参数以及属性值探索

    因项目问题,对webgl进行了探索,当进行到3d相机时,对camera的up,position属性有部分难以理解的地方,因此做下了记录. 代码如下: import React, {Component} ...

  10. 【转】百亿级实时大数据分析项目,为什么不用Hadoop?

    百亿数量级的大数据项目,软硬件总体预算只有30万左右,需求是进行复杂分析查询,性能要求多数分析请求达到秒级响应.        遇到这样的项目需求,预算不多的情况,似乎只能考虑基于Hadoop来实施. ...