输入正文

/**
 * 使用递归将数组转为树形结构
 * 父ID属性为parent
 */
public static array2Tree (array: any, parentId: number) {
    if (Tool.isEmpty(array)) {
        return [];
    }

    const result = [];
    for (let i = 0; i < array.length; i++) {
        const c = array[i];
        // console.log(Number(c.parent), Number(parentId));
        if (Number(c.parent) === Number(parentId)) {
            result.push(c);

            // 递归查看当前节点对应的子节点
            const children = Tool.array2Tree(array, c.id);
            if (Tool.isNotEmpty(children)) {
                c.children = children;
            }
        }
    }
    return result;
}

<a-table
    :columns="columns"
    :row-key="record => record.id"
    :data-source="level1"
    :loading="loading"
    :pagination="false"
>

/**
 * 一级分类树，children属性就是二级分类
 * [{
 *   id: "",
 *   name: "",
 *   children: [{
 *     id: "",
 *     name: "",
 *   }]
 * }]
 */
const level1 = ref(); // 一级分类树，children属性就是二级分类

/**
 * 数据查询
 **/
const handleQuery = () => {
  loading.value = true;

  axios.get("/category/all").then((response) => {

    loading.value = false;

    const data = response.data;

    if (data.success) {

      categorys.value = data.content;

      console.log("原始数组：", categorys.value);

      level1.value = [];

      level1.value = Tool.array2Tree(categorys.value, 0);

      console.log("树形结构：", level1);

    } else {
      message.error(data.message);
    }

  });
};