代码拉取完成,页面将自动刷新
2.10.1
Google Chrome 117.0.5938.152
疑是 BUG
下拉树TreeSelect选择数据时,会将选择框给撑大,能不能将选中的标签宽度给固定,超出进行文字隐藏,鼠标移上去显示具体信息,这样排列起来就会很整齐。
<template>
<lay-tree-select style="" multiple @change="test" v-model="value2" :data="data2" ></lay-tree-select>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
const value2 = ref([23, 5555])
const data2 = ref([
{
title: '一级1',
id: 1,
field: 'name1',
checked: true,
spread: true,
children: [
{
title: '二级1-1 可允许跳转',
id: 3,
field: 'name11',
href: 'https://www.layui.com/',
children: [
{
title: '三级1-1-3',
id: 23,
field: '',
children: [
{
title: '四级1-1-3-1',
id: 24,
field: '',
children: [
{
title: '五级1-1-3-1-1',
id: 30,
field: '',
},
{
title: '五级1-1-3-1-2',
id: 31,
field: '',
},
],
},
],
},
{
title: '三级1-1-1',
id: 7,
field: '',
children: [
{
title: '四级1-1-1-1 可允许跳转',
id: 15,
field: '',
href: 'https://www.layui.com/doc/',
},
],
},
{
title: '三级1-1-2',
id: 8,
field: '',
children: [
{
title: '四级1-1-2-1',
id: 32,
field: '',
},
],
},
],
},
{
title: '二级1-2',
id: 4,
spread: true,
children: [
{
title: '三级1-2-1',
id: 9,
field: '',
disabled: true,
},
{
title: '三级1-2-2',
id: 10,
field: '',
},
],
},
{
title: '二级1-3',
id: 20,
field: '',
children: [
{
title: '三级1-3-1',
id: 21,
field: '',
},
{
title: '三级1-3-2',
id: 22,
field: '',
},
],
},
],
},
{
title: '一级2',
id: 2,
field: '',
spread: true,
children: [
{
title: '二级2-1',
id: 5,
field: '',
spread: true,
children: [
{
title: '三级2-1-1',
id: 11,
field: '',
},
{
title: '三级2-1-2',
id: 12,
field: '',
},
],
},
{
title: '二级2-2',
id: 6,
field: '',
children: [
{
title: '三级2-2-1',
id: 13,
field: '',
},
{
title: '三级2-2-2',
id: 14,
field: '',
disabled: true,
},
],
},
],
},
{
title: '一级3',
id: 16,
field: '',
children: [
{
title: '二级3-1',
id: 17,
field: '',
fixed: true,
children: [
{
title: '三级3-1-1',
id: 18,
field: '',
},
{
title: '三级3-1-2',
id: 19,
field: '',
},
],
},
{
title: '二级3-2',
id: 27,
field: '',
children: [
{
title: '三级3-2-1',
id: 28,
field: '',
},
{
title: '三级3-2-2',
id: 29,
field: '',
},
],
},
],
},
])
function test(val){
console.log(val);
}
</script>
点击删除,不会触发change事件
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。
登录 后才可以发表评论