el-select

ElementUI常见问题

系列文章目录文章目录系列文章目录前言一、Select选择器el-select新增自定义选项el-option二、Icon图标图标偶发性乱码问题三、Input输入框el-input输入限制el-input
IT-fly·2023-06-18 08:02

基于Element-ui 表单弹窗列表选择封装

el-select下拉框大家都知道，但是下拉框只能选择一个，而且如果数据太多的话也不太容易选择，所以这里就是封装了组件包含对应的弹窗，就是能实现多选，而且列表也是分页展示的，选择完之后将对应的名称展示在文本框中
会说法语的猪·2023-06-17 18:31

vue+element-ui el-select + el-tree下拉树形结构组件(新增多选功能且可以全选、反选、清空)

一、最终效果二、具体HTML代码（详情请看源码）全选清空反选三、参数配置1、代码示例2、配置参数（Attributes）继承el-select和el-treeAttributes参数说明类型默认值optionstree
wocwin·2023-06-17 15:31

vue+el-select下拉实现：全选、反选、清空功能

问题描述：el-select下拉框要求实现全选功能。
Best_Liu~·2023-06-17 15:59

解决elementUI弹出框关闭后再打开el-select下拉框无法选中的问题

el-select组件在一个弹框中，打开该弹框，el-select可以正常选中，但是保存弹框中的表单信息关闭弹框后，再打开弹框，出现select组件无法选中的问题。
WEB前端圈·2023-06-16 01:53

去掉el-select中的小箭头+option太长省略...

HTML:=40"placement="top-start"width="400"trigger="hover">{{v.label}}{{v.label.slice(0,37)+'...'}}{{v.label}}CSS:去掉小箭头::v-deep.applySelect.el-icon-arrow-up:before{content:''}SCRIPT:去掉下拉handleTask(){thi
流浪新时代·2023-06-15 12:34

切换el-table中的el-select 点击添加将该行新增到新的表格中

一、先上效果图二、具体需求实现1、切换下拉框展开折叠框并显示二维码等相关信息弹框布局注意：这里会遇到一个问题第一次切换下拉框expand不展开解决：加上唯一标识就能解决该问题row-key=“subId”二维码列表{{props.row.isLogin}}有效期至:{{props.row.expireTimeStr}}下载区取消清空批量下载2、切换二维码版次重点：展开行this.$refs.ref
Yilia-Feng·2023-06-14 19:52

关于el-select 与el-tree组合可筛选组件

1605166703.jpg1605167577(1).jpg{{data.className}}//className为props中label的字段名exportdafault{data(){return{filterText:'',//input输入框输入的筛选字段treeClick:null,defaultProps:{value:'id',label:'className',childre
wuli_静哥哥·2023-06-14 06:16

el-select多选+搜索功能实现

最终效果(http://47.98.205.88:3000/mult_group_selection)见下图。image准备工作：除了vue脚手架、element等必要包之外。该项目还用到了linq.js(https://github.com/mihaifm/linq)，该工具可以快速从数组中查找所需内容。npminstall--savelinq编辑build/webpack.base.conf.
流过·2023-06-13 09:22

element-plus的el-select实现触底加载更多(新版本报错踩坑)

即.el-select下默认不包含.el-select-dropdown了。现象当依旧按照之前的方式，封装自定义指令，实现滚动到el-select下拉菜单的底部，加载更多数据的功能时就会报错。
jingqw·2023-06-13 03:45

element-ui 表单校验，el-select校验失效问题

model="addForm"用model绑定表单，而不是v-model，没问题2、需要添加校验的对应字段，是否添加了prop属性，ok没问题3、检查rules,里面校验提示的事件是否正确，发现了问题，之前el-select
m0_66899315·2023-06-12 19:30

vue el-select下拉列表调整，去掉右侧滚动条

.el-select-dropdown__item{height:0.1483rem}将上边的代码放到文件末尾。
雨笋情缘·2023-06-11 16:23

输入框点击出现下拉框。下拉框点击不隐藏下拉框同时出现详情弹窗

需求：实现如下图分析：1.下拉框带搜索，一般情况下使用el-select组件完成，该需求存在的问题是点击选项，不能隐藏下拉框，同时显示详情信息。
runOnWay·2023-06-11 04:32

el-select下拉框选中数据进阶操作

需求：将图一操作变更为图二，选中时选择框内显示选择选项，下拉框内不显示选中选项，并且多个下拉框同步共享（即加工工位选择过的，其他工位无法选择）代码：js：/***每次改变数据，就会请求原有的数据，即：每次选择数据都会在原有数据上过滤*/searchSelect(a,b,c,d){//扩展运算符letval=[...a,...b,...c,...d]listWorkStation().then(re
帆仔哟·2023-06-10 05:46

el-select关于@blur失去焦点的坑

今天使用el-select的@blur方法,发现第一次选择失去焦点后,没获取到选择的值(e.target.value)解决方法:1采用计时器//el-select失去焦点必填校验blurSelect(e
山谷里的杂货铺·2023-06-09 07:34

el-select绑定值为对象时校验必填失效问题记录

问题描述el-select绑定对象实现分页下拉查询报销人功能，修改回显时清空报销人没有触发必填校验。
Komorebi゛·2023-06-07 20:11

el-select获取下拉框选中的label和value值

el-select获取下拉框选中的label和value值【示例1】data(){return{ruleForm:{list:[{goodModularId:'',goodModular:''}]}}}
Komorebi゛·2023-06-07 20:11

el-select实现鼠标悬浮在下拉选项上显示该项的其他信息

使用@mouseover.native实现鼠标悬浮在下拉选项上显示该项的地址信息{{item.name}}{{address}}data(){return{addressId:'',addressName:''}}methods:{showAddress(id,val){this.addressId=idthis.addressName=val}}
Komorebi゛·2023-06-07 20:40

vue el-select数据量太大，导致浏览器崩溃解决办法

下拉数据量太大，浏览器单线程渲染时间较长，会导致浏览器崩溃。为了解决这一问题，可以采用懒加载形式，完美解决以上是下拉框代码段:filter-method="filterMethod"自定义筛选方法，支持筛选v-el-select-loadmore="loadmore"懒加载方法directives:{'el-select-loadmore':{bind(el,binding){constSELEC
Best_Liu~·2023-06-07 18:43

解决element ui select下拉框不回显数据问题

使用的前端语言是vue,使用webpack构建vue-cli全家桶在项目中用到el-select时遇到一个问题，就是在编辑表单时，下拉框的不显示数据，前台代码如下:在浏览器中查看列表返回的数据:1111
Mracale·2023-06-07 17:05

el-select绑定对象并可以实现回显

注意value值绑定的对象，需要啥数据就绑定自己想要的数据想要实现回显，注意value-key绑定的键名
暗月Moon·2023-04-21 18:47

Vue2-黑马（六）

elementuiCascader级联选择器（3）Router-路由配置（4）Router-动态导入（1）element-uisearch搜索我们按姓名搜索，用简单的文本输入框el-input：性别、年龄搜索：做一个下拉选择框el-select
dengfengling999·2023-04-21 10:57

VUE element-ui 使用Screefull 页面全屏时el-select下拉菜单不显示（下拉框不显示无法选择）问题解决

简介：VUEelement-ui之页面全屏时el-select下拉菜单不显示问题解决问题原因：elemrnt-ui会默认将弹出框插入至body元素；当设置了某个元素全屏时，会遮挡住原来的select下拉数据
蓝胖子的多啦A梦·2023-04-21 03:08

基于vue3+Elementplus封装通用表单组件

主要思路：基于elementplus，并利用配置文件，生成表单控件（el-input,el-select,el-button等），设置栏栅布局，设置表单校验，提交按钮，placeholder，labelWidth
黎小小咩~·2023-04-19 20:49

Element el-select - 切换单多选时显示问题

一、问题直接上图这里选择科目后，我再切换到柱状图，按道理是要这样但是却这样值没有被清空这是啥问题呢，一开始百思不得其解代码中使用了v-if安照常理，如果我切换了就会销毁，但是效果并不是这样，因为vue复用了中的inputvue出于提高性能，所以vue给复用了也就是说根本原因是：vue在切换的过程中，认为input不需要销毁重建，所以直接复用了。二、解决方法如何告诉vue单选和多选不要复用呢？答案是
老电影故事·2023-04-18 15:15

elementUI el-input el-select输入框 设置高度和宽度

//html模块//改变el-input的宽高.relicMapSearch/deep/#input1{width:pxToRem(310);height:pxToRem(40);min-height:pxToRem(40);position:relative;}//改变el-input的宽高.relicMapSearch/deep/#select{width:pxToRem(100);heigh
·小新·2023-04-18 08:19

兼容ie遇到的问题-记录

1.在ie中使用elementui中的el-select组件时会产生聚焦问题如图：解决方法：jsmethods:{inputBlur(flag,refName){//隐藏下拉时失去焦点（针对ie）if(
执着于98斤的it女·2023-04-17 23:14

element-ui Select 选择器切换时如何传递对象

1:el-select下拉组件在切换值是默认传的的value,但是如果你想传递一个对象过去可以这样写利用value-key这个属性绑定值为对象的时候必填，我们把value值绑定为item对象，这样切换值的时候就可以把相应的对象带过去
nice_u1·2023-04-17 18:28

el-select 多选取值_Python实战—Lasso回归选取关键特征

芭蕉不展丁香结，同向春风各自愁！下雨天，宜安静、宜愁思雨滴滴答答地下远方的你还好吗？今天，分享一下Lasso回归用于选取关键特征，数据探索性分析时，引入的特征太多，要直接用这些特征建模分析，需要对原始特征进一步筛选，只保留重要的特征，Lasso算法在模型系数绝对值之和小于某常数的条件下，谋求残差平方和最小，在变量选取方面的效果优于逐步回归、主成分回归、岭回归、偏最小二乘等，能较好的克服传统方法在模
weixin_39897218·2023-04-16 07:17

【elementUI样式】模态框中的el-select下拉框不跟随页面滚动问题

文章目录1.在el-select标签中设置:popper-append-to-body="false"2.样式穿透（比较普遍的写法）模态框中的el-select下拉框不跟随页面滚动问题在使用elementUI
简单长庚·2023-04-15 00:23

关于ElementUI el-select 绑定对象的探索

为了简单，直接引用ElementUI官网的例子，当需要绑定一个对象的时候直接给el-option的value属性设置为遍历集合的一个对象如下：exportdefault{data(){return{options:[{value:'选项1',label:'黄金糕'},{value:'选项2',label:'双皮奶'},{value:'选项3',label:'蚵仔煎'},{value:'选项4',l
spring_zto·2023-04-14 11:44

element el-select数据名称过长，优化方式

原因：el-select数据名称过长，就会出现铺满屏幕的情况优化后：固定宽度，超出显示省略号，鼠标移上去再显示全部文字，如图优化步骤1：1.el-select添加：:popper-append-to-body
风掠过有空白·2023-04-14 10:04

vue下拉el-select三级联动（公司-部门-人员）

vue下拉el-select三级联动举个例子：公司-部门-人员vue页面中：data(){return{//公司companyid:null,companylist:[],//部门departmentid
嘿………·2023-04-14 02:28

el-select组件封装(解决同页面中多处使用到el-select,且使用对象相同但各自id不同的情况)

使用背景:每个装备下都有多个批次,以下拉框展示,所以要求每个下拉框里数据不一样,且其中一个下拉框数据选择发生变化时,不能影响其他的!引用组件代码:importSelectfrom"./component/el-select.vue";components:{Select}封装的组件代码如下:exportdefault{data(){return{curBatchNumber:"",//当前装备批号
怎么吃不饱捏·2023-04-12 22:29

解决vue2版本，el-select下拉框数据量过多，el-select进行分页请求懒加载，滚动防抖加载，支持关键字过滤及其他el-select属性

场景element-plus中有虚拟化选择器el-select-v2实现滚动加载下拉框，但是在一些比较老的项目中使用的是el-ement版本的UI，除了单独引入el-select-v2进行局部引用外，我们还可以自己手动封装一个滚动分页下拉代码如下-->-->importVuefrom'vue'import{debounce}from'lodash-es'//选项每行高度constOPTION_LI
阿乐今天敲代码没·2023-04-11 06:25

vue.js el-select 传多个值

el-select选择框，选择之后传值，万一要传多个值怎么办，v-model只绑定了一个值。
queue·2023-04-10 14:12

el-select多选情况下回显的问题

问题：el-select在设置multiple（复选）的情况下，无法回显预期：image错误：image其实这个问题的错误原因是数据类型的问题。
小四_5e7b·2023-04-07 18:05

Element el-select 选择框选中后可删除

选中选择项后可删除选项内容选择黄金糕后删除糕字效果如下：{value=ev.target.value}">exportdefault{data(){return{options:[{value:'选项1',label:'黄金糕'},{value:'选项2',label:'双皮奶'}],optionsFilter:[{value:'选项1',label:'黄金糕'},{value:'选项2',lab
huaiyanchen·2023-04-07 17:40

【el-select change 事件和 remove-tag 事件参数如何绑定为对象】

el-selectremove-tag事件和change事件参数如何绑定为对象value-key作为value唯一标识的键名，绑定值为对象类型时必填，类型为string，默认值为el-option的valuevalue绑定的是对象时，在el-select
历目·2023-04-07 16:49

vue+elementui中对el-select封装

通过对el-select的简单封装可以在整个项目中进行使用，既然代码优化了，也让技术人员对代码的操作性提高了不说那么多直接上代码：通过define对vue和element-ui进行引入在html中使用是通过
lixu_boke·2023-04-06 21:18

vue2虚拟下拉选择器

vue虚拟滚动下拉选择器目的为了解决element-ui中el-select组件在大数据量的情况下出现的性能问题(数据量太大，导致渲染过慢，或造成页面卡顿甚至于卡死)。
獨孤殤·2023-04-06 16:02

解决element-ui的el-select选择器的@blur事件失效的坑

目录element-ui的el-select选择器的@blur事件失效解决使用el-select中的@blur遇到的问题解决element-ui的el-select选择器的@blur事件失效element-UI
·2023-04-06 01:42

关于elementUI select控件绑定多个值(对象)

目录elementUIselect控件绑定多个值el-select绑定多个值id、value总结elementUIselect控件绑定多个值通常使用的时候v-model都是绑定一个值，这样没有问题，但在某些需求中会获取选择项的多个值
·2023-04-05 16:31

el-select的 value-key 使用

项目中需要将options数组中的value和label两个值传到后台//数据options:[{value:'1',label:'种植分布'},{value:'2',label:'物联网示范点'}],此时在el-select
js代码人·2023-04-05 15:39

el-select可以新建条目时 限制输入字数

一.el-select新建条目需要设置allow-create和filterable二.限制字数分为两种三种情况来说明1.页面中仅有一个el-select/*data中定义*/subject:'',subjectOption
安安安安安沅·2023-04-05 13:20

Vue自定义组件并实现v-model

为了使组件使用起来更简单或者简洁，我们在vue项目中可能需要自定义组件，并且为它实现v-model，以下介绍具体的实现（此处是对element-ui组件el-select的二次封装）v-model实现原理
风喃海北·2023-04-05 02:59

当 elementUi 选中一个值，其余选项全部高亮解决

下拉框选中一个值，其余选项全部高亮没有选之前选中一个选项之后解决代码：注意事项1.如上代码value绑定的是item的对象;2.首先在el-option中添加:key="item.id"的属性;3.然后在el-select
yuan_404·2023-04-04 05:00

el-select 改变弹出提示框，点击取消值变为原值

el-select所支持的方法中都无法取到旧值。那么监听change事件弹出提示，点击取消要改为旧值应该怎么实现呢？使用watch进行监听，每次siteId改变都将旧值先存起来。
Y、seventeen·2023-04-04 01:05

Vue 使用el-select 实现模糊搜索内嵌tag

Document.increase_list_ipt.el-input__suffix{top:1px;right:2px;}.increase_list_ipt.el-tag{height:32px;background-color:rgba(15,163,255,0.1);color:#0fa3ff;font-size:16px;}.increase_list_ipt.el-tag__clos
上优·2023-04-02 18:12

ElementUI实现在下拉列表里面进行搜索功能详解

目录分析:html:js:css:使用总结分析:首先我们需要实现上图的效果,然后Element-UI的el-select是没有的,所以需要自己写我们需要用到el-popover组件,然后使用它的v-model
·2023-04-02 01:39
上一页 7 8 9 10 11 12 13 14 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他