如何实现自定义标签排序

开发
1

你好。

我正在尝试按主题标签组的名称值对其进行自定义排序。

我一直在关注主题组件，并认为这是可行的方法，但我也想听听关于此事的意见，以及一些指导，因为这将是我第一个主题组件。

祝好！

3 个赞
2

我最终使用标签描述字段来存储一个整数，以模拟我想要的顺序。问题是标签组既没有在标签结构中公开，也没有在 DOM 中公开，这就是我使用这种方式的原因。

之后，我使用主题编辑器中的头部代码片段将以下脚本注入 DOM。

这使我能够动态地重新排序标签。虽然目前这是一种“hack”，但至少它奏效了。

<script type="text/discourse-plugin" version="0.8">
  api.addTagsHtmlCallback(function(topic, params) {
    const containers = document.querySelectorAll(".discourse-tags");
    for (const container of containers) {
      const children = Array.from(container.children);

      children.sort((a, b) => {
        const orderA = parseInt(a.getAttribute("title"));
        const orderB = parseInt(b.getAttribute("title"));
        return orderA - orderB;
      });

      children.forEach(child => container.appendChild(child));
    }
  }, {priority: 100});
</script>