el-select 默认选中第一个

最新推荐文章于 2024-05-14 22:52:31 发布
最新推荐文章于 2024-05-14 22:52:31 发布
阅读量3.1k 收藏 2
点赞数
文章标签： vue.js elementui javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/pmywy/article/details/130149714
版权
该代码段展示了在Vue.js应用中如何使用el-form-item和el-select组件创建一个开关规则选择器。v-model绑定到form.rule，并在change事件中调用TebChange方法。选项列表来源于ruleList数组，初始值设为ruleList的第一个元素的id。
摘要由CSDN通过智能技术生成

1.静态选择第一个 

<el-form-item label="开关规则">
     <el-select v-model="form.rule" @change="TebChange">
           <el-option 
               v-for="item in ruleList" 
               :key="item.id" 
               :label="item.ruleType1" 
               :value="item.id">
           </el-option>
      </el-select>
</el-form-item>
created() {
    this.form.rule = this.ruleList[0].id
  },

潘潘！
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
详解element-ui中el-select的默认选择项问题
12-29
直接绑定将option中的value值绑定给v-model <template> <div> <el v-model=query> <el v-for=item key=item.value value=item.value label=item.label></el> </el> </div> </template> [removed] export default{ data() { return { options: [{ value: '01',
el-select 默认选中第一个，动态&&静态获取
热门推荐
m0_64178358的博客
02-14 3万+
el-select 默认选中第一个，动态&&静态获取
el-select默认选中第一个，设置默认值
爬楼梯的前端小白的博客
09-19 1万+
在页面初始化时默认选中第一个。
el select 选中某一项_elementUI select组件 默认选择第一项
weixin_39760650的博客
12-20 6740
场景：后台返回最近医保年 5个年份的数据 [2019,2018,2017,2016,2015],将数据以props形式传入 searchForm组件 并以select形式作为搜索条件展示，默认选中最近一年情况一：已知select options数组 如下设置：export default {data() {return {options: [{value: '选项1',label: '黄金糕'},...
vue使用Element的select 选择器，需要默认选中第一个
m0_59023970的博客
03-31 1万+
简介 今天写项目，需要循环出select内的数据以后，页面一加载默认选中第一个数据，写完循环发现原本默认显示第一条的select框没变化，要选择后才有显示，结果查了好多文档，讲的都不是很清楚，自己研究了一下,发现很简单,记录一下。 一.初始效果 二.代码 <template> <div class="statistical"> <span>请选择店铺：</span> <div> ..
el-select下拉默认第一个值
qq_37958178的博客
05-10 2280
el-select下拉默认
el-select 默认选中值
最新发布
qq_33240556的博客
05-14 3989
绑定一个变量，并且初始化这个变量为想要默认选中的选项的值。组件用于创建下拉选择菜单。如果你想设置一个默认选中的值，你可以使用。在Element UI（一个用于Vue.js的UI框架）中，如果你想让“选项2”作为默认选中项，你只需在。这样，当页面加载时，“选项2”就会被默认选中。// 初始化这里为你想默认选中的值。
elementUI select组件默认选中效果实现的方法
12-29
首先，v-model的值为当前被选中的el-option的 value 属性值 需求：进入编辑页面，状态栏默认选中生效，如下显示： html部分代码：
解决element-ui里的下拉多选框 el-select 时,默认值不可删除问题
10-14
最后，补充知识部分介绍了在vue和elementUI环境下，如何使用el-select组件来选中多个值，并在需要的情况下删除其中的一两个。具体的方法可以通过代码实现，这里不再展开。 总结来说，本文主要解决了在element-ui的...
vue el-tree 默认展开第一个节点的实现代码
01-19
对于后台返回的数据，默认展开其第一层的第一个，其实很简单：对于获取到的后台数据，将其第一层节点添加到数组中，将 default-expanded-keys 绑定数组，从而设置默认展开的节点。 实际应用：默认展开第一层节点中的...
vue.js 解决v-model让select默认选中不生效的问题
11-20
然而，当遇到`v-model`无法使`select`默认选中指定选项的问题时，开发者可能会感到困惑。这个问题通常涉及到数据加载顺序、异步操作以及数据类型匹配等多个方面。 首先，让我们分析这个问题的背景。在描述中提到，...
el-select 默认选中第一个，ElementUI 下拉框
CC酱写前端的博客
03-11 3722
ElementUI 下拉框，el-select静态获取数据， 默认选中第一个 <el-select v-model="formData.status" placeholder="请选择" class="filter-item" style="width: 130px"> <el-option v-for="item in statusLists" :key="item.key" :label="item.status_name"
elementui下拉框默认选中第一个的方法
qq_43894292的博客
06-17 9974
vue
element ui Select选择器默认展开第一个
csychencsy的博客
06-29 888
找到要展开的那个数据的id,通过:default-expanded-keys里面填的id就是默认要展开的。通过：这个属性给每个数据添加唯一标识的键名。
element 下拉选择 默认第一个
m0_53591810的博客
03-31 1925
第二：再created里面进行调用。第一：准备dom结构。
el-select默认选中第一个
05-10
可以通过设置 `v-model` 绑定值来实现 el-select 默认选中第一个选项，将 `v-model` 绑定到选项数组的第一个元素即可。例如： ```html <el-select v-model="selectedOption"> <el-option v-for="option in options" :key="option.value" :label="option.label" :value="option.value"></el-option> </el-select> ``` 在组件的 `data` 选项中，将 `selectedOption` 初始化为选项数组的第一个元素即可： ```javascript data() { return { options: [ { label: '选项1', value: 1 }, { label: '选项2', value: 2 }, { label: '选项3', value: 3 } ], selectedOption: 1 // 默认选中第一个选项 } } ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值