Vue3 layui Tree组件自定义字段名 文字不显示问题

>> 原因

版本问题 2.14.0版本不显示 

1.将@layui/layui-vue卸载后 npm uninstall @layui/layui-vue

2.下载最新版即可   npm uninstall @layui/layui-vue@2.15.0 // 文章编写时最新版

>> 效果  替换的字段名不生效

 >> 代码 -- 官方文档案例 Layui - Vue 前端 UI 框架

<template>
  <div>
    <lay-tree :data="data9" :showCheckbox="showCheckbox2" v-model:checkedKeys="checkedKeys2"
      :replaceFields="replaceFields">
    </lay-tree>
  </div>
</template>
<script setup>
import { ref } from 'vue';
const checkedKeys2 = ref([]);
const showCheckbox2 = ref(true);
const replaceFields = ref({
  id: 'key',
  title: 'name',
  children: 'child'
})
const data9 = ref([{
  name: '一级1',
  key: 1,
  spread: true,
  child: [
    {
      name: '一级1-1',
      key: 11,
      child: [
        {
          name: '一级1-1-1',
          key: 111,
        },
        {
          name: '一级1-1-2',
          key: 112,
        }
      ]
    },
    {
      name: '一级1-2',
      key: 12,
      child: [
        {
          name: '一级1-2-1',
          key: 121,
        },
        {
          name: '一级1-2-2',
          key: 122,
        }
      ]
    }
  ]
},
{
  name: '一级2',
  key: 2,
  spread: true,
  child: [
    {
      name: '一级2-1',
      key: 21,
      spread: true,
    },
    {
      name: '一级2-2',
      key: 22,
      spread: true,
      child: [
        {
          name: '一级2-2-1',
          key: 221,
          spread: true,
        }
      ]
    }
  ]
}]);
</script>

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值