merge

src/component/tag/index.less

@@ -73,12 +73,10 @@
      }
    }
 
-   &-ellipsis &-text {
-     display: inline-block;
-     white-space: nowrap;
-     word-wrap: normal;
-     overflow: hidden;
-     text-overflow: ellipsis
+   & &-text {
+      overflow: hidden; 
+      text-overflow: ellipsis; 
+      white-space: nowrap
    }
 
    & &-close-icon {

src/component/tag/index.vue

@@ -6,7 +6,7 @@ export default {
 <script lang="ts" setup>
 import "./index.less";
 import { LayIcon } from "@layui/icons-vue";
-import { computed, ref } from "vue";
+import { computed, nextTick, ref } from "vue";
 import { TinyColor } from "@ctrl/tinycolor";
 import { TagShape, TagType, TagVariant } from "./interface";
 
@@ -49,13 +49,12 @@ const classTag = computed(() => [
     [`layui-tag-${props.type}`]: props.type,
     "layui-tag-bordered": props.bordered,
     "layui-tag-disabled": props.disabled,
-    "layui-tag-ellipsis": props.maxWidth,
   },
 ]);
 
 const styleTag = computed(() => [
   {
-    "max-width": props.maxWidth ?? "unset",
+    "max-width": props.maxWidth ?? "100%",
     ...useTagCustomStyle(props).value,
   },
 ]);
@@ -105,10 +104,9 @@ function useTagCustomStyle(props: TagProps) {
     <span v-if="$slots.icon" class="layui-tag-icon">
       <slot name="icon" />
     </span>
-    <span v-if="maxWidth" :style="styleTag" class="layui-tag-text">
+    <span class="layui-tag-text">
       <slot />
     </span>
-    <slot v-else />
     <span
       v-if="closable"
       class="layui-tag-close-icon"