typescript 如何为对象数组创建一个带有复选框的Muiv5树视图?

iyr7buue  于 2023-03-13  发布在  TypeScript
关注(0)|答案(1)|浏览(87)

我正在使用muiv 5树视图组件来构建一个树视图下拉列表。该组件没有复选框支持选择/取消选择,但经过一番搜索,我找到了一种类似的解决方案,但需要传递到树视图的数据是一个对象,它有一个父节点。我不需要父节点。基本上我的结构是一个对象数组,而不是一个对象。下面是codesandbox项目Click here的链接
富对象是

const data: RenderTree = {
  id: 'root',
  name: 'Parent',
  children: [
    {
      id: '1',
      name: 'Child - 1',
    },
    {
      id: '3',
      name: 'Child - 3',
      children: [
        {
          id: '4',
          name: 'Child - 4',
        },
      ],
    },
  ],
};

但我的数据

const data = [
    {
      id: '1',
      name: 'Child - 1',
    },
    {
      id: '3',
      name: 'Child - 3',
      children: [
        {
          id: '4',
          name: 'Child - 4',
        },
      ],
    },
],

我不希望显示根父节点

cidc1ykv

cidc1ykv1#

我一直在寻找相同的解决方案,但没有找到,所以我创建了一个。
请注意,取消选择时应添加父节点。
请看我的示例:Working example using MUI library

相关问题