element中的select如何在下拉数据改变后清空之前的选择？

最新推荐文章于 2023-11-15 10:33:59 发布
最新推荐文章于 2023-11-15 10:33:59 发布
阅读量6.9k 收藏 3
点赞数 4
分类专栏： element
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u012374512/article/details/103580172
版权

如图1，在第一个下拉选择的时候，第二个select 动态赋值，
在这里插入图片描述但是在选择了第一次动态生成的选项后，重新选择了第一个select的选项，第二个下拉中的选项也随之更改了，但是刚才的选项并没有去除，还在上面

解决方法：给需要清空的值添加一个判断就行：

斌阿哥
关注
  • 4
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 11
    评论
专栏目录
解决element ui select下拉框不回显数据问题的解决
10-17
主要介绍了解决element ui select下拉框不回显数据问题的解决，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
element-ui中select组件绑定值改变,触发change事件方法
10-18
今天小编就为大家分享一篇element-ui中select组件绑定值改变,触发change事件方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
element-ui select 二级联动 在使用select 选择框时,2个select 怎么关联在一起(第一个值发生变化,第二个select值随第一个变化而不同)...
weixin_42590539的博客
12-26 1088
你可以通过使用v-model和v-bind绑定来实现这个功能。首先，你需要定义一个变量来保存第一个选择框的值，然后在第一个选择框的v-model中绑定这个变量。 然后，你可以通过使用v-bind:disabled或v-bind:options来实现对第二个选择框的控制。比如，当第一个选择框的值发生变化时，你可以通过在第二个选择框上使用v-bind:disabled="value1 !== 'som...
element-ui中的select下拉列表设置默认值方法
01-19
element-ui中的select下拉列表如何设置默认值？ 在element-ui的运用中，涉及到了select下拉列表。项目中需要将select的默认值给展示出来 那如何修改呢？ 上element-ui中的代码片段
详解element-ui设置下拉选择切换必填和非必填
10-16
主要介绍了详解element-ui设置下拉选择切换必填和非必填，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
vue+el-select下拉实现：全选、反选、清空功能
热门推荐
askuld的博客
06-13 1万+
2、为el-select绑定change事件和remove-tag事件，具体实现全选功能写在事件中。el-select下拉框要求实现全选功能。1、给el-select增加【全选】【清空】【反选】按钮。
el-select设置clearable属性
qq_38210427的博客
04-17 3887
包含清空按钮，可将选择器清空为初始状态。
element ui select下拉框清空为空字符
最新发布
qq_46738283的博客
11-15 1313
使用clearable清空选项此时绑定的值是“” 空字符串，要使清空后值为null，需要自己写clear事件。
el-select 多选，清空，选择“全部”其余清空，取消全部，其余还原
weixin_41346436的博客
12-22 4899
el-select 多选，清空，选择“全部”其余清空，取消全部，其余还原 记录一下 <el-form-item v-show="formData.pushScope == '个人'" label="选择学生:"> <el-select id="newStyle" v-model="formData.studentIdList" multiple pla
element-ui中el-select低版本清除选项，el-select 要怎么清空已选的数据，显示最初的 placeholder？
migexiaoliang的博客
05-17 8658
项目场景： 场景一：初始化的时候展示【全部】，点击后清空可搜索。 如下图为初始化状态： 点击后可直接进行搜索： 场景二：但是低版本element的el-select加上filterable后，点击后会是以下现象： 没点击前： 点击后： 解决方案： 为了解决场景二的现象，编辑代码如下： <div class="search-item"> <span>操作分类：</span> <el-select
详解element-ui中el-select的默认选择项问题
12-29
直接绑定将option中的value值绑定给v-model <el v-for=item key=item.value value=item.value label=item.label></el> [removed] export default{ data() { return { options: [{ value: '01',
详解关于element级联选择器数据回显问题
12-29
element级联选择器数据回显问题 对于前端小菜鸡来说，被这个问题也是困扰了好久。也是百度的方法。 表单部分代码： 部门名称： prop=deptId> 请选择部门 props=depShowType options=deptData v-model=...
Vue Element 分组+多选+可搜索Select选择器实现示例
12-04
实际就是将element三种官方select实例整合起来，同时实现分组+多选+可搜索，此外点击一级分组名可以实现全选/全不选。供有相关需求的开发者参考 准备工作： 除了vue脚手架、element等必要包之外。该项目还用到了...
在element-ui的select下拉框加上滚动加载
12-12
在项目中，我们需要运用到很多来自后端返回的数据。有时是上百条，有时甚至上千条。如果加上后端的多表查询或者数据量过大，这就导致在前端的显示就会及其慢，特别是在网络不好的时候更是如此。 自然，后端就做了一...
解决element-ui里的下拉多选框 el-select 时,默认值不可删除问题
10-14
主要介绍了解决element-ui里的下拉多选框 el-select 时,默认值不可删除问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Element ui 下拉多选时新增一个选择所有的选项
10-16
主要介绍了Element ui 下拉多选时 新增一个选择所有的选项,本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
Element实现表格分页数据选择+全选所有完善批量操作
12-11
后台管理系统中的列表页面，一般都会有对列表数据进行批量操作的功能，例如：批量删除、批量删除等。...一开始以为不就是分页的时候把之前选中的数据存储在一个list里面嘛，然后选择的时候map一下。等到自己
Vue 实现动态循环出的多个select 不能重复选择相同的数据
01-20
Vue 实现动态循环出的多个select 不能重复选择相同的数据前言效果图演示实现逻辑代码总结 前言 1.本篇文章功能的实现是基于vue的计算属性computed 2.个人感觉vue的计算属性computed挺适合做这个功能的，因为通过计算...
python+selenium select下拉选择框定位处理方法
01-01
总结一下python+selenium select下拉选择框定位处理的两种方式，以备后续使用时查询； 二、直接定位（XPath） 使用Firebug找到需要定位到的元素，直接右键复制XPath，使用find_element_by_xpath定位； driver = ...
elementui 清空下拉框值_element中的select如何在下拉数据改变后清空之前的选择？..
06-13
在 Element UI 中，你可以通过 `v-model` 来绑定下拉框的值。当下拉框的选项发生变化时，`v-model` 绑定的变量也会随之改变。因此，如果你想要在下拉框的选项发生变化后清空之前的选择，只需要在 `v-model` 绑定的变量上进行操作即可。 具体来说，你可以在下拉框的 `change` 事件中，将 `v-model` 绑定的变量设置为空字符串，代码如下： ```html <template> <el-select v-model="selectedValue" @change="handleSelectChange"> <!-- 下拉框选项 --> </el-select> </template> <script> export default { data() { return { selectedValue: '', // 下拉框绑定的变量 } }, methods: { handleSelectChange() { this.selectedValue = ''; // 在选项发生变化时将变量清空 }, }, }; </script> ``` 这样，在下拉框的选项发生变化时，`selectedValue` 变量就会被清空，之前的选择也就被清除了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 11
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值