🌀(component): tag-input 样式, tag-width 超出 input 宽度时自动省略文本
This commit is contained in:
parent
11eada1d9d
commit
c1325055fb
@ -55,7 +55,7 @@ const classTag = computed(() => [
|
|||||||
|
|
||||||
const styleTag = computed(() => [
|
const styleTag = computed(() => [
|
||||||
{
|
{
|
||||||
"max-width": props.maxWidth ?? "unset",
|
"max-width": props.maxWidth ?? "100%",
|
||||||
...useTagCustomStyle(props).value,
|
...useTagCustomStyle(props).value,
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
@ -105,10 +105,12 @@ function useTagCustomStyle(props: TagProps) {
|
|||||||
<span v-if="$slots.icon" class="layui-tag-icon">
|
<span v-if="$slots.icon" class="layui-tag-icon">
|
||||||
<slot name="icon" />
|
<slot name="icon" />
|
||||||
</span>
|
</span>
|
||||||
|
<span style="overflow: hidden;text-overflow: ellipsis;white-space:nowrap;">
|
||||||
<span v-if="maxWidth" :style="styleTag" class="layui-tag-text">
|
<span v-if="maxWidth" :style="styleTag" class="layui-tag-text">
|
||||||
<slot />
|
<slot />
|
||||||
</span>
|
</span>
|
||||||
<slot v-else />
|
<slot v-else />
|
||||||
|
</span>
|
||||||
<span
|
<span
|
||||||
v-if="closable"
|
v-if="closable"
|
||||||
class="layui-tag-close-icon"
|
class="layui-tag-close-icon"
|
||||||
|
@ -86,7 +86,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
width: fit-content;
|
width: 100%;
|
||||||
height: auto;
|
height: auto;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
|
@ -11,6 +11,18 @@
|
|||||||
<template>
|
<template>
|
||||||
<lay-timeline>
|
<lay-timeline>
|
||||||
<lay-timeline-item title="1.7.x">
|
<lay-timeline-item title="1.7.x">
|
||||||
|
<ul>
|
||||||
|
<a name="1-7-8"></a>
|
||||||
|
<li>
|
||||||
|
<h3>1.7.8 <span class="layui-badge-rim">2022-11-15</span></h3>
|
||||||
|
<ul>
|
||||||
|
<li>[修复] backtop 组件部分浏览器版本无法正常返回顶部。</li>
|
||||||
|
<li>[优化] date-picker 组件 btn 操作 border-radius 样式细节。</li>
|
||||||
|
<li>[优化] tag-input 组件 maxWidth 属性默认为 100%。</li>
|
||||||
|
<li>[优化] tag-input 组件 tagWidth 超出 input 宽度时自动省略文本。</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
<ul>
|
<ul>
|
||||||
<a name="1-7-7"></a>
|
<a name="1-7-7"></a>
|
||||||
<li>
|
<li>
|
||||||
|
Loading…
Reference in New Issue
Block a user