element 下拉框单选转多选回显不清空

最新推荐文章于 2024-04-11 09:42:00 发布
最新推荐文章于 2024-04-11 09:42:00 发布
阅读量886 收藏 1
点赞数
文章标签： html css javascript vue.js elementui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_47904525/article/details/120307577
版权
本文介绍了在使用ElementUI时遇到的一个问题，即下拉框根据分析方法的code值在单选和多选间切换时，输入名称未能正确清空。通过设置一个标识符`isAnalyseCode`并监听其变化，成功解决了回显不清空的问题，确保了页面状态与数据同步。
摘要由CSDN通过智能技术生成

   当分析方法改变成其他选项时，输入名称需要变成相应的单选或者多选并且清空

 条件就是当分析方法的的code为4时是单选，其他时候都是多选

现在分析方法从code=4切换到code=3，但是输入名称没有回显还是有

尝试了用this.$set(),然后debugger，输入清空了，但是页面还是没有清空，并且已经有了非空校验，然后又用this.$forceUpdate(),oh my gad,强刷都不得行

解决方法：在输入名称那儿加一个标识符，v-if=“isAnalyseCode”

isAnalyseCode默认赋值为TRUE，然后监听isAnalyseCode

 

这样就好啦！！！！

 

 

前端的一颗小白菜
关注
使用el-select封装支持搜索、多选、滚动分页的下拉框组件
swagLi的博客
08-03 2614
一、相信做管理后台的都会遇到这样需求、因为数据量太大下拉框数据采用滚动分页的方式同时支持搜索、多选/单选，下面是组件内容 1、目录放在components/commom-scroll/index <template> <el-select v-model="activeValue" v-loadmore="loadMore" remote filterable :remote-method="remoteMethod" class="sc
（vue）封装element的单选el-tree和el-select（数只允许两层）
wang_min_bao的博客
12-21 1178
封装element的单选el-tree和el-select（树只允许两层）
vue中实现下拉菜单单选，多选，查询选中
骨子里的偏爱
04-20 3004
【代码】vue中实现下拉菜单单选，多选，查询选中。
el-select 单选变多选时选项框显示出错
明月兮宝璐
04-24 741
<el-select @change="getDataPre" v-if="options.techStackSelect==4" filterable v-model="options.projectSelect" placeholder="请选择项目" > &...
Element-UI 下拉框单选转多选回显不清空绑定的值
最新发布
Jana Jing的分享
04-11 342
单选和多选这两个 input 看上去没差别（自身和层级都一致），vue出于提高性能，所以 vue 给复用了。根据radio切换来更改下拉框是否多选。
select下拉框实现多选功能
热门推荐
weixin_42442123的博客
11-05 4万+
&lt;select id="all"&gt; &lt;option&gt;牡丹&lt;/option&gt; &lt;option&gt;向日葵&lt;/option&gt; &lt;option&gt;薰衣草&lt;/option&gt; &lt;option&gt;雏菊&lt;/op
关于vue单选和多选切换过程中的坑
iter23的博客
06-13 1388
关于vue单选和多选切换过程中的坑 问题：vue单选多选切换时，会报错， children must be keyed: 原因是切换过程中错误栈都在Vue内部 解决办法：select标签加v-if判断，multiple属性加条件multiple，watch监控multiple的变化，先关闭select再重新加载。 不足之处：切换过程中有短暂的可见的框变动。功能满足，但实现效果不很理想。 ...
下拉框使用select2样式后 下拉框不能清空的问题及解决方式
Lei_Da_Gou的博客
06-12 2542
$("#select2-catId2-container").attr("title",""); $("#select2-catId2-container").empty();//中间catId2是你select下拉框的id $("#select2-catId2-container").prepend('&lt;option value=""&gt; -- 请选择 -- &
element input框 select下拉框选中赋值不了，如何解决这些问题
songweibin的博客
06-09 2018
在项目中遇到一些赋值操作后不管input框赋值后输入删除，还是select下拉框选中赋值不了，一半没有项目中没有用正则的话可以用强制刷新起到回显赋值 要是有正则的话可以用到
elementui el-select multiple回显无法删除和修改
qq_38409075的博客
02-16 1481
elementui el-select回显无法删除和修改 在el-select标签上加上 @change="$forceUpdate()" $forceUpdate()是elementui自己定义的函数
element select 多选内容过多内容没有去除问题
qq_40896095的博客
06-09 635
Element Select 多选内容过多DOM更新问题
ElementUI Select单选切换多选无法清除历史数据的解决方案
sinat_33255495的博客
07-13 3315
需求场景：有一个tab切换，每一个tab下都有一个 下拉框，只是一个是多选一个是单选，问题是当切换tab标签的时候，下拉框的样式不会被清空。解决方案： 简单到吐血，却困了我好几天。只需要在 el-select 上加一个 key 就可以完美解决。我想了一下，出现这个问题的原因就是组件没有重新渲染，加上 key 可以定位渲染，仅此而已。...
element-ui Select 清空model，页面没有清空选中项的问题
AsuraSylar的博客
08-20 4405
业务场景： 在dialog 每次打开时， 选择应用程序要初始化为空。 最初的做法为： 监听dialog的show状态，当show为false时，设置selectApp为空这样写时，虽然selectApp的值为空了，但是页面仍然显示为上次选中的option。 watch:{ show:function(val){ 　　　　if(!val){ ...
VUE ELEMENT UI 清空select 下拉选项
weixin_43577131的博客
10-09 9963
VUE ELEMENT UI 清空select 下拉选项 1.select代码 <el-form ref="searchForm" :inline="true" :model="searchForm" label-width="80px"> <el-form-item label="设备类别" prop="equipmentType"> <el-select v-model="searchForm.equipmentType.code" clearable @change
element-ui多选下拉框增加全选和清空操作
weixin_38384296的博客
03-20 5645
ElMultipleSelect组件 <template> <el-select multiple v-model.sync="modelValue" :placeholder="placeholder" :clearable="clearable" :filterable="filterable" :disabled="d...
el-select的multiple属性从false切换为true时页面值不清空
weixin_43965251的博客
06-17 403
el-select页面值清空失败
element-ui中el-select低版本清除选项，el-select 要怎么清空已选的数据，显示最初的 placeholder？
migexiaoliang的博客
05-17 9077
项目场景： 场景一：初始化的时候展示【全部】，点击后清空可搜索。 如下图为初始化状态： 点击后可直接进行搜索： 场景二：但是低版本element的el-select加上filterable后，点击后会是以下现象： 没点击前： 点击后： 解决方案： 为了解决场景二的现象，编辑代码如下： <div class="search-item"> <span>操作分类：</span> <el-select
elementui下拉框 清空_使用element ui的el-select级联下拉时，清空选项其他下拉框受到影响，怎么解决？...
weixin_39530839的博客
12-23 2077
1、在使用el-select时，级联下拉框，当把一个选项清空后，其他下拉框的数据发生改变，都变为第一个框的数据2、` changeHandler(value, 1)" @clear="clearOption(1)">v-for="item in provinceOpts":key="item.deptCode":label="item.deptName":value="ite...
Extjs下拉框多选 回显
05-20
在 Extjs 中，可以通过设置 `multiSelect` 属性为 `true` 来实现下拉框多选。回显则需要先获取到下拉框组件的值，然后将其赋值给需要回显的表单元素。 例如，在以下代码中，我们创建了一个下拉框组件，设置了 `...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值