如果数据给的是树形 转好的树形结构并且是有两个二级children的话 该如何写?

简介: 如果数据给的是树形 转好的树形结构并且是有两个二级children的话 该如何写?

第一我们要自己写一个children  并且张数据里面的所要渲染的二级进行赋值  赋给我们新建的children

以下是代码转树形赋值

  organ().then(function (res) {
            console.log(res); // 成功回调
            // setLists(res.data.data)
            res.data.data = res.data.data.map((obj) => ({
                ...obj, // 复制当前对象的所有属性
                children: [], // 添加一个空的 children 数组
            }));
            for (let i = 0; i < res.data.data.length; i++) {
                res.data.data[i].children = res.data.data[i].project;
                for (let k = 0; k < res.data.data[i].children.length; k++) {
                    res.data.data[i].children[k].account = res.data.data[i].children[k].title;
                    setList(res.data.data)
                    setIndexoff(res.data.data)
                }
            }
            // copyList.value = list.value;
        })

第一个封装的接口 第二个是赋值所有的数据,再将数据赋值到新的children里面就可以实现  

最后将转好的children树形数据 再声明const 进行赋值  在表格中进行渲染  table有他自己的属性 自动会进行渲染即可

 <Table
                rowKey={(record) => `${record.id}-${record.id}`}
                columns={columns}
                pagination={{
                    position: ['bottomCenter'],
                    defaultPageSize: '5',
                    showSizeChanger: true,
                    showQuickJumper: true,
                    pageSizeOptions: [5, 10, 15, 20]
                }}
                style={{ 'paddingTop': '30px' }}
                bordered
                onRow={(record) => {
                    return {
                        onClick: () => { information(record) }, // 点击行
                    };
                }}
                dataSource={list}
            />
相关文章
|
小程序 开发工具 Android开发
uni-app使用HBuilder X编辑器本地打包apk步骤说明
uni-app使用HBuilder X编辑器本地打包apk步骤说明
2898 0
|
JavaScript
js 字符串String转对象Object
该代码示例展示了如何将一个以逗号分隔的字符串(`&#39;1.2,2,3,4,5&#39;`)转换为对象数组。通过使用`split(&#39;,&#39;)`分割字符串并`map(parseFloat)`处理每个元素,将字符串转换成浮点数数组,最终得到一个对象数组,其类型为`object`。
640 2
|
开发工具 git
对于github不同的分支main或者master,git拉取代码的时候怎么拉取不同分支的代码
对于github不同的分支main或者master,git拉取代码的时候怎么拉取不同分支的代码
694 1
|
JSON Java UED
uniapp:使用DCloud的uni-push推送消息通知(在线模式)java实现
以上展示了使用Java结合DCloud的uni-push进行在线消息推送的基本步骤和实现方法。实际部署时,可能需要依据实际项目的规模,业务场景及用户基数进行必要的调整和优化,确保消息推送机制在保证用户体验的同时也满足业务需求。
1617 0
|
JavaScript
vue父子组件传值,父组件内容更新子组件内容不实时更新
vue父子组件传值,父组件内容更新子组件内容不实时更新
4082 0
|
安全 Java 程序员
Java中的异常处理:深入理解try-catch-finally语句
【8月更文挑战第31天】在Java编程的海洋中,异常处理是一艘不可或缺的救生艇。本文将带你驶入异常处理的深海,探索try-catch-finally语句的秘密岛屿,揭示它们如何协同作战,确保程序即使在风浪中也能安全航行。准备好你的航海图,我们将一起启航!
|
移动开发 前端开发 JavaScript
uniapp如何打包h5项目
uniapp如何打包h5项目
1583 0
|
JavaScript 前端开发
js数组包对象格式怎么根据不同的键值使用sort排序一组数组
js数组包对象格式怎么根据不同的键值使用sort排序一组数组
159 0
|
Java
Java - 一篇带你了解类成员(基本数据类型/包装类/对象/数组)默认值
Java - 一篇带你了解类成员(基本数据类型/包装类/对象/数组)默认值
238 0