el-select默认值设置

2021-02-26 乐帮网

vuejs

本篇文章主要介绍为el-select设置固定选项值和默认选中值。假设我的option是固定的怎么在el-select中显示出来呢？首先我们看一下官方文档的使用示例：

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

以及数据结构如下：

export default {
    data() {
      return {
        options: [{
          value: '1',
          label: '选项1'
        }, {
          value: '2',
          label: '选项2'
        }, {
          value: '3',
          label: '选项3'
        }],
        defaultvalue: '2'
      }
    }
  }

设置固定选项和值就分别使用上述数据字段options 和defaultvalue，这才是正常的做法，切不能写成如下样子：

<el-select v-model="value" placeholder="请选择">
   <el-option label="选项1"  value="1"></el-option>
 <el-option label="选项2"  value="2"></el-option>
 <el-option label="选项3"  value="3"></el-option>
</el-select>

即使我的Option项和value项是固定的也不能直接写，也必须定义到数据结构当中，然后再绑定到界面。

来源：https://lebang2020.cn/details/2102262gqihrnn.html

关注我的微信公众号
在公众号里留言交流
投稿邮箱：1052839972@qq.com

庭院深深深几许？杨柳堆烟，帘幕无重数。
玉勒雕鞍游冶处，楼高不见章台路。
雨横风狂三月暮。门掩黄昏，无计留春住。
泪眼问花花不语，乱红飞过秋千去。

如果感觉对您有帮助
欢迎向作者提供捐赠
这将是创作的最大动力