如何在制表符中过滤树结构中的子项?

2023-11-23

我尝试打电话setFilter在我的制表符树结构上运行函数,以过滤掉项目。它似乎只过滤掉顶级父母。知道如何使其适用于任何级别(任何儿童或家长)吗?http://tabulator.info/docs/4.1/tree没有过多说明过滤的工作原理。

Function

table.setFilter('id', '=', 214659)没有返回任何东西...

树形结构

[
   {
      "level":0,
      "name":"word1",
      "id":125582,
      "_children":[
         {
            "level":1,
            "name":"word6",
            "id":214659
         },
         {
            "level":1,
            "name":"word7",
            "id":214633
         },
         {
            "level":1,
            "name":"word2",
            "id":214263,
            "_children":[
               {
                  "level":2,
                  "name":"word8",
                  "id":131673
               },
               {
                  "level":2,
                  "name":"word9",
                  "id":125579
               },
               {
                  "level":2,
                  "name":"word10",
                  "id":125578
               },
               {
                  "level":2,
                  "name":"word4",
                  "id":172670,
                  "_children":[
                     {
                        "level":3,
                        "name":"word13",
                        "id":172669
                     },
                     {
                        "level":3,
                        "name":"word14",
                        "id":174777
                     },
                     {
                        "level":3,
                        "name":"word5",
                        "id":207661,
                        "_children":[
                           {
                              "level":4,
                              "name":"word15",
                              "id":216529
                           },
                           {
                              "level":4,
                              "name":"word16",
                              "id":223884,
                              "_children":[
                                 {
                                    "level":5,
                                    "name":"word17",
                                    "id":223885,
                                    "_children":[
                                       {
                                          "level":6,
                                          "name":"word18",
                                          "id":229186,
                                          "_children":[
                                             {
                                                "level":7,
                                                "name":"word19",
                                                "id":219062
                                             },
                                             {
                                                "level":7,
                                                "name":"word20",
                                                "id":222243
                                             }
                                          ]
                                       }
                                    ]
                                 }
                              ]
                           }
                        ]
                     }
                  ]
               },
               {
                  "level":2,
                  "name":"word3",
                  "id":214266,
                  "_children":[
                     {
                        "level":3,
                        "name":"word11",
                        "id":216675
                     },
                     {
                        "level":3,
                        "name":"word12",
                        "id":216671
                     }
                  ]
               }
            ]
         }
      ]
   }
]

经过一番搜索后发现了一个扩展lodash图书馆叫deepdash它具有深层过滤并且效果很好。

您将有 2 个新的依赖项,但我认为它将满足您的目的。 检查有关如何安装它们的文档here

在此处的代码片段中,您可以在日志中看到结果。我也做了一个沙箱here

这是一个或多个 id 列表。

如果您只需要一个值,请更改条件。return _.indexOf(idList, value.id) !== -1; to return id===value.id; where id是你的id多变的

另外,在查看 Tabulator 的文档后,只有一级过滤,即使您编写自己的自定义过滤器也无济于事,因为它期望一个 bool 值来渲染行或不渲染行。但仅适用于第一级,因此如果父级不是您所寻找的,则子级将被忽略。您唯一的选择是过滤制表符之外的数据。

const data = [
  {
    level: 0,
    name: "word1",
    id: 125582,
    _children: [
      {
        level: 1,
        name: "word6",
        id: 214659
      },
      {
        level: 1,
        name: "word7",
        id: 214633
      },
      {
        level: 1,
        name: "word2",
        id: 214263,
        _children: [
          {
            level: 2,
            name: "word8",
            id: 131673
          },
          {
            level: 2,
            name: "word9",
            id: 125579
          },
          {
            level: 2,
            name: "word10",
            id: 125578
          },
          {
            level: 2,
            name: "word4",
            id: 172670,
            _children: [
              {
                level: 3,
                name: "word13",
                id: 172669
              },
              {
                level: 3,
                name: "word14",
                id: 174777
              },
              {
                level: 3,
                name: "word5",
                id: 207661,
                _children: [
                  {
                    level: 4,
                    name: "word15",
                    id: 216529
                  },
                  {
                    level: 4,
                    name: "word16",
                    id: 223884,
                    _children: [
                      {
                        level: 5,
                        name: "word17",
                        id: 223885,
                        _children: [
                          {
                            level: 6,
                            name: "word18",
                            id: 229186,
                            _children: [
                              {
                                level: 7,
                                name: "word19",
                                id: 219062
                              },
                              {
                                level: 7,
                                name: "word20",
                                id: 222243
                              }
                            ]
                          }
                        ]
                      }
                    ]
                  }
                ]
              }
            ]
          },
          {
            level: 2,
            name: "word3",
            id: 214266,
            _children: [
              {
                level: 3,
                name: "word11",
                id: 216675
              },
              {
                level: 3,
                name: "word12",
                id: 216671
              }
            ]
          }
        ]
      }
    ]
  }
];

const idList = [214659];
const found = _.filterDeep(
  data,
  function(value) {
    return _.indexOf(idList, value.id) !== -1;
  },
  { tree: true, childrenPath: '_children' }
);

console.log(found);
<script src="https://cdn.jsdelivr.net/npm/lodash/lodash.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/deepdash/browser/deepdash.min.js"></script>
<script>
  deepdash(_);
</script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在制表符中过滤树结构中的子项? 的相关文章

  • memcpy 与 C 中的赋值——应该是 memmove?

    正如指出的这个问题的答案 编译器 在本例中是 gcc 4 1 2 是的 它很旧 不 我无法更改它 可以在它认为合适的地方用 memcpy 替换结构体赋值 我正在 valgrind 下运行一些代码 并收到有关 memcpy 源 目标重叠的警告
  • 在Java中,为什么超类方法不能从子类实例访问受保护或私有方法/变量?

    让我们从另一种行为开始 即使您将方法 变量声明为私有 同一类的另一个实例也可以访问它 没关系 我可以忍受 我将这些称为类私有而不是实例私有 现在问题部分 例如 在运行时我希望能够检查所有字符串变量thisclass 不为 null 如果为
  • junit 3 中的类拆解?

    我们有很多使用 JUnit 编写的集成测试3 尽管我们现在运行它们4 4 其中一些需要在类中的所有测试完成后运行的tearDown 方法 以释放一些公共资源 我发现这可以在 junit 4 中使用 AfterClass org junit

随机推荐

  • 在 SQL 中将列转换为行[重复]

    这个问题在这里已经有答案了 我需要编写一个查询 该查询获取行并将其转换为列 这是我的表 Count fname lname id 1 abc def 20 2 pqr 20 3 abc xyz 20 4 xyz xyz 20 1 abc d
  • git 的耐心差异算法的实现是否正确?

    Stackoverflow 上的这个问题似乎是应用耐心差异算法的良好候选者 然而 在测试我的潜在答案时 我发现git diff patience没有达到我的预期 并且在这种情况下 与默认的 diff 算法没有什么不同 cat a Funct
  • Android 中如何检查数据库是否存在?

    我正在使用 Room API 在我的 Android 应用程序中实现数据库 似乎每次我加载应用程序时 它都会尝试一次又一次地创建数据库 有什么办法可以限制这个吗 db Room databaseBuilder context AppData
  • 在Android中启用MultiDex支持以在Eclipse中实现65K+方法

    我正在尝试在 eclipse 中构建 Multidex apk 但未能成功 我尝试了以下步骤 在 Android 应用程序中配置 Multidex 支持 我已将位于 extras android support multidex 的 Mul
  • 带有滚动视图的 Android 操作栏选项卡在方向更改后复制了视图

    我有一个非常简单的代码 我将操作栏与选项卡片段一起使用 加载后它工作正常 但方向改变后它会变得疯狂 旧片段也可见 为什么 Sorry for Hungarian texts on the image but I hope it doesn
  • 当浏览器以角度关闭时清除本地存储

    我创建了一个 Angular 5 应用程序 它使用基于令牌的系统 当前我将令牌存储在本地存储中 我希望本地存储在浏览器关闭时保持清晰 并且在浏览器刷新时不清除本地存储 我没有使用sessionstorage的原因是因为在新选项卡或窗口中打开
  • 将第一行与数据框中的列标题合并

    我正在尝试清理 Excel 文件以进行进一步的研究 我遇到的问题是 我想合并第一行和第二行 我现在拥有的代码 xl pd ExcelFile nanonose xls df xl parse Sheet1 df df drop Unname
  • 浏览器滚动条移位

    当您转到我的网站上有额外内容的页面时 滚动条出现在右侧 但我的内容有明显的向左移动 您可以通过单击主页 托管并再次返回我的网站 www ipalaces org 来注意到这一点 如何解释页面上的浏览器滚动条 我可以让滚动条至少始终可见吗 我
  • 调试 ASP.NET Core 时看不到值

    使用 Visual Studio 2015 调试 ASP NET Core 应用程序时 我无法看到变量 参数和字段值 例如 将鼠标悬停在这些值上 我也无法将它们添加到手表中 我正在调试中运行 我们可能已经找到了问题的解决方案 或至少是解决方
  • 如何将对象转换为其实际类型?

    如果我有 void MyMethod Object obj 我怎样才能投obj它的实际类型是什么 如果您知道实际类型 那么只需 SomeType typed SomeType obj typed MyFunction 如果您不知道实际类型
  • 使用 tkinter 制作简单动画

    我有一个简单的代码来使用 tkinter 可视化一些数据 按钮单击绑定到重绘下一个数据 帧 的函数 但是 我希望能够选择以一定的频率自动重绘 我对 GUI 编程非常陌生 我不需要为这段代码做很多事情 所以我的大部分 tkinter 知识都来
  • 为什么 Apache Flink 需要 Watermarks 进行事件时间处理?

    有人可以正确解释事件时间戳和水印吗 我从文档中理解了它 但不是那么清楚 现实生活中的例子或外行定义会有所帮助 另外 如果可能的话请给出一个示例 以及一些可以解释它的代码片段 提前致谢 这是一个示例 说明了为什么我们需要水印以及它们的工作原理
  • 在循环内启动任务:如何传递可以在循环内更改的值? [复制]

    这个问题在这里已经有答案了 我正在尝试在 while 循环内使用 TPL 并且需要将一些值传递给任务 然后这些值会更改为循环 例如 这里显示了一个索引递增的示例 必须在请求创建任务的行之后 int index 0 Task tasks wh
  • 每个类型的自定义 Json.NET 序列化器设置

    我正在使用 ApiController 它使用全局 HttpConfiguration 类来指定 JsonFormatter 设置 我可以非常轻松地全局设置序列化设置 如下所示 config Formatters JsonFormatter
  • 重复的 postgresql 模式,包括序列

    我的数据库布局需要为每个新客户创建新架构 目前我使用在网上找到的内部函数并进行了一些修改 CREATE FUNCTION copy schema source schema character varying target schema c
  • Leaflet for R:如何自定义簇的颜色?

    如何自定义 R 传单包中 addMarkers 函数的颜色 簇的默认颜色是 1 10 绿色 11 100黄色 100 Red 我想将范围和颜色更改为 1 100 红色 101 1000黄色 1000 绿色 JS Leaflet有这个功能 h
  • 触发CSS:非锚定元素的主动选择器

    如何通过 JavaScript jQuery 触发非锚定元素的 active 状态 复习时W3C CSS2 规范第 5 11 3 节参考 hover 伪选择器来查看如何触发 a 的激活 我遇到了以下内容 这让我相信它应该是可能的 activ
  • 在生产中每晚使用 Rust

    有人可以向我解释一下 Rust nightly 是如何 生产 的吗 我想使用PyO3使用的板条箱专业化需要每晚 Rust 的功能 使用 Rust 的夜间版本是否可以用于生产 我知道未来版本中可能会出现问题 并且可能会引入 API 更改 但就
  • 拦截 INSTALL_REFERRER 然后转发到 Google AnalyticsReceiver

    我编写了一个安装接收器来确定应用程序何时通过市场安装 但是 我还想将 INSTALL REFERRER 广播传递到其他接收器 例如 Google AnalyticsAnalyticsReceiver如果它安装在应用程序内 重要的是 我不知道
  • 如何在制表符中过滤树结构中的子项?

    我尝试打电话setFilter在我的制表符树结构上运行函数 以过滤掉项目 它似乎只过滤掉顶级父母 知道如何使其适用于任何级别 任何儿童或家长 吗 http tabulator info docs 4 1 tree没有过多说明过滤的工作原理