Vue 把Llist 数据转化为 Tree 数据

创建 js 文件treeList，添加以下方法

/**
 * 将 list 数组转化为 treeList
 * @param {Array} dataList list数据
 * @param {string} id 节点key值
 * @param {string} pId 父节点key值
 * @returns {Array} treeList
 */
export const listToTree = (dataList, id, pId) => {
    const data = JSON.parse(JSON.stringify(dataList));
    const result = [];

    // 检查数据是否为数组
    if (!Array.isArray(data)) {
        return result;
    }

    // 移除每个数据项中的 children 属性
    data.forEach((item) => {
        delete item.children;
    });

    // 创建一个映射对象，用于快速查找节点
    const map = {};
    data.forEach(item => {
        map[item[id]] = item;
    });

    // 构建树形结构
    data.forEach(item => {
        const parent = map[item[pId]];
        if (parent) {
            (parent.children || (parent.children = [])).push(item);
        } else {
            result.push(item);
        }
    });

    return result;
};

基础使用

// 引入 js 文件
import { listToTree } from "../../../../api/listToTree";

this.tableData = listToTree(res.data, 'LAND_LIST_ID', 'PARENT_ID')