取巧方式el-select单选重复选择

前言:之前产品是可以多选,我就一想在el-select

加个multiple不就完事了吗?我兴高采烈几分钟就实现了这个选择框,可是后面说单选也要重复多选几个,顿时我就****,又不想自己写个

首先安装element-plus 一定要安装2.5+版本

复制代码
       <el-select :model-value="sitem.filter" filterable multiple style="width:420px;" class="m-2"
            size="large">
            <template #tag>
                <el-tag v-for="(tagitem, tagindex) in sitem.filter" :key="tagindex" class="mx-1"
                    type="info" closable @close="remotab(sindex, tagindex)">
                    {{ tagitem }}
                </el-tag>
            </template>
            <el-option v-for="(item, i) in sheenlist[sindex]" :key="i" :label="item" :value="i">
                <template #default>
                    <div @click="changevalue(item, sindex)">{{ item }}</div>
                </template>
            </el-option>
        </el-select>

自定义tag这样就能自己获取到标签的数据实现删除

自定义default实现表格的添加

相关推荐
mCell7 分钟前
JavaScript 运行机制详解:再谈 Event Loop
前端·javascript·浏览器
amy_jork2 小时前
npm删除包
开发语言·javascript·ecmascript
帧栈4 小时前
开发避坑指南(27):Vue3中高效安全修改列表元素属性的方法
前端·vue.js
max5006004 小时前
基于桥梁三维模型的无人机检测路径规划系统设计与实现
前端·javascript·python·算法·无人机·easyui
excel4 小时前
使用函数式封装绘制科赫雪花(Koch Snowflake)
前端
我命由我123455 小时前
软件开发 - 避免过多的 if-else 语句(使用策略模式、使用映射表、使用枚举、使用函数式编程)
java·开发语言·javascript·设计模式·java-ee·策略模式·js
萌萌哒草头将军5 小时前
Node.js v24.6.0 新功能速览 🚀🚀🚀
前端·javascript·node.js
AALoveTouch6 小时前
大麦APP抢票揭秘
javascript
持久的棒棒君7 小时前
启动electron桌面项目控制台输出中文时乱码解决
前端·javascript·electron
小离a_a7 小时前
使用原生css实现word目录样式,标题后面的...动态长度并始终在标题后方(生成点线)
前端·css