Reactjs Antd表排序忽略子级

我试图对包含子对象的表进行排序，但它忽略了子对象的“年龄”值所有项目（包括子项）应按升序或降序排序。不确定这是错误还是我的实现不正确

密码箱：

当前结果是忽略子项。这个想法太简单了，把树上的每一项都分类

js:

const列=[
{
标题：“姓名”，
数据索引：“名称”，
键：“名称”
},
{
标题：“年龄”，
数据索引：“年龄”，
关键：“年龄”，
宽度：“12%”，
分拣机：{
比较：（a，b）=>a.age-b.age，
倍数：3
}
},
{
标题：“地址”，
数据索引：“地址”，
宽度：“30%”，
关键字：“地址”
}
];
常数数据=[
{
重点:1,，
姓名：“老约翰·布朗”，
年龄:60,，
地址：“纽约第一湖公园”，
儿童：[
{
关键词：11，
姓名：“约翰·布朗”，
年龄:42,，
地址：“纽约第二湖公园”
}
]
},
{
重点:二,，
姓名：“乔·布莱克”，
年龄:22,，
地址：“悉尼第一湖公园”，
儿童：[
{
关键词：10，
姓名：“约翰·布朗”，
年龄:12岁，
地址：“纽约第二湖公园”
}
]
}
];
功能更改（分页、过滤器、分拣机、额外）{
控制台日志（“参数”，额外）；
}
函数TreeData（）{
返回(
);
}

不能将父元素和子元素放在同一棵树中，以便所有元素都按年龄排序

这将不再是一棵树，也毫无意义。你会失去父子关系

如果要按年龄对所有元素进行排序，则必须将项目移动到列表中并在其中进行排序

您只能在同一级别对项目进行排序，@edo9k的做法是正确的

对于每个树级别，树排序按年龄进行：

• 父母[22,61,62]
• 儿童1[12]
• 儿童2[10,30,40]
• 儿童3 [41,42]

---

不能将父元素和子元素放在同一棵树中，以便所有元素都按年龄排序

这将不再是一棵树，也毫无意义。你会失去父子关系

如果要按年龄对所有元素进行排序，则必须将项目移动到列表中并在其中进行排序

您只能在同一级别对项目进行排序，@edo9k的做法是正确的

对于每个树级别，树排序按年龄进行：

• 父母[22,61,62]
• 儿童1[12]
• 儿童2[10,30,40]
• 儿童3 [41,42]

---

通过AntD实现这一点的最佳方法是使用嵌套表组件。您可以将主表中每一行的可扩展/子数据显示在此嵌套表中，然后通过在嵌套表中合并可排序函数，您可以对该数据进行排序。

通过AntD实现此目的的最佳方法是使用嵌套表组件。您可以将主表中每一行的可扩展/子数据显示在此嵌套表中，然后通过将可排序函数合并到嵌套表中，您可以对该数据进行排序。

排序正确。我在您的示例中添加了更多的子项，您可以在这里看到它的排序是正确的：但是这些子项在它们所属的类别中也是按年龄排序的。如果希望子项与父项在同一级别排序。。。您必须考虑一种不同的方式来表示哪一行是“子行”，哪一行是“父行”。是的，每个项目都应该按升序或降序排序。我发布了一个屏幕截图，显示了当前结果。它与子项不同步。表正在根据其类别对每个项进行排序。按年龄分列的父母=

[22,61,62]

。按年龄分列的雅娜儿童=

[12]

。Xavier的子女年龄=

[10,30,40]

。华纳儿童的年龄=

[41,42]

。是否要将所有子级一起排序？是的，树中的所有内容都应一起排序。排序正确。我在您的示例中添加了更多的子项，您可以在这里看到它的排序是正确的：但是这些子项在它们所属的类别中也是按年龄排序的。如果希望子项与父项在同一级别排序。。。您必须考虑一种不同的方式来表示哪一行是“子行”，哪一行是“父行”。是的，每个项目都应该按升序或降序排序。我发布了一个屏幕截图，显示了当前结果。它与子项不同步。表正在根据其类别对每个项进行排序。按年龄分列的父母=

[22,61,62]

。按年龄分列的雅娜儿童=

[12]

。Xavier的子女年龄=

[10,30,40]

。华纳儿童的年龄=

[41,42]

。是否要将所有子项排序在一起？是的，树中的所有项都应排序在一起

const columns = [
  {
    title: "Name",
    dataIndex: "name",
    key: "name"
  },
  {
    title: "Age",
    dataIndex: "age",
    key: "age",
    width: "12%",
    sorter: {
      compare: (a, b) => a.age - b.age,
      multiple: 3
    }
  },
  {
    title: "Address",
    dataIndex: "address",
    width: "30%",
    key: "address"
  }
];

const data = [
  {
    key: 1,
    name: "John Brown sr.",
    age: 60,
    address: "New York No. 1 Lake Park",
    children: [
      {
        key: 11,
        name: "John Brown",
        age: 42,
        address: "New York No. 2 Lake Park"
      }
    ]
  },
  {
    key: 2,
    name: "Joe Black",
    age: 22,
    address: "Sidney No. 1 Lake Park",
    children: [
      {
        key: 10,
        name: "John Brown",
        age: 12,
        address: "New York No. 2 Lake Park"
      }
    ]
  }
];

function onChange(pagination, filters, sorter, extra) {
  console.log("params", extra);
}

function TreeData() {
  return (
    <>
      <Table
        columns={columns}
        dataSource={data}
        onChange={onChange}
        indentSize={0}
      />
    </>
  );
}