element icon indicating copy to clipboard operation
element copied to clipboard

[bug report] when the bug: filterable and multiple attributes of the cascader component exist at the same time, size = "mini" is invalid

Open Jlong0104 opened this issue 3 years ago • 6 comments

Element UI version

2.15.6

OS/Browsers version

chrome 94.0

Vue version

2.6.14

Reproduction Link

https://codepen.io/pen/

Steps to reproduce

1、打开https://codepen.io/pen/ 2、测试下面的代码:

What is Expected?

size="mini"有效

What is actually happening?

size="mini"无效

Jlong0104 avatar Oct 19 '21 07:10 Jlong0104

Translation of this issue:

Element UI version

2.15.6

OS/Browsers version

chrome 94.0

Vue version

2.6.14

Reproduction Link

https://codepen.io/pen/

Steps to reproduce

  1. Open https://codepen.io/pen/

  2. Test the following code:

<el-cascader size="mini"

:options="options" :props="{ multiple: true }"

filterable clearable

size="mini" :options="options"

filterable clearable

What is Expected?

Size = "mini" valid

What is actually happening?

Size = "mini" is invalid

element-bot avatar Oct 19 '21 07:10 element-bot

image

Jlong0104 avatar Oct 19 '21 08:10 Jlong0104

image 试了一下,没法复现···

John-Soul avatar Oct 19 '21 10:10 John-Soul

@John-Soul 你参数不对,按照我截图的代码,可以看到两个都是mini,但第二个框明显大很多

Jlong0104 avatar Oct 27 '21 06:10 Jlong0104

@John-Soul 你参数不对,按照我截图的代码,可以看到两个都是mini,但第二个框明显大很多

初始情况下确实加了多选的级联选择器比不加的高了6px,el-input__inner多了行内样式height:34px, 这个高度是为了给选中元素调整输入框的高度。

但是如果针对增加多选的级联选择器还原高度为28px,则会出现如下情况: image image

(不过既然是多选,那势必会增加高度,感觉在实际使用中还是无解,只是解决了初始化时尺寸统一。)

John-Soul avatar Oct 27 '21 09:10 John-Soul

当 filterable 和 multiple 同时开启,影响其cascader高度 通过size调整为mini 和 small,目测是调整内部 placeholder 字体的大小和cascader宽度,当size设置为middle 才有高度的变化

birne9 avatar Aug 25 '22 01:08 birne9