如何在页面渲染完成后运行代码

开发
1

我想移除 span.category-topics--posts-count 的括号（由 GitHub - discourse/discourse-right-sidebar-blocks 渲染）。我尝试了 api.onPageChange() 调用，但它没有获取到任何 countSpans，我认为是因为它运行在另一个主题组件将它们添加到页面之前。

我该怎么办？ :crying_cat:


  api.onPageChange(() => {
    console.log("页面已更改");

    const countSpans = document.querySelectorAll(
      "span.category-topics--posts-count"
    );
    console.log("span", countSpans);
    countSpans.forEach((span) => {
      const currentText = span.textContent.trim();
      const newText = currentText.replace(/[()]/g, "");
      span.textContent = newText;
      const number = parseInt(newText);
      if (isNaN(number)) {
        span.style.padding = "0px";
      } else if (number < 10) {
        span.style.padding = "0px";
      } else {
        span.style.padding = "0px 3px";
      }
    });
  });
});
2 个赞
2

我不认为这会奏效。

你必须通过 CSS 或在 Ember 运行循环中执行这些操作。

有什么阻止你分叉那个组件并根据你的喜好进行自定义，使用不同的名称加载一个主题组件，然后在 RSB 中通过名称添加它？

2 个赞
3

主要是懒惰。当我开始的时候，它只是一个很小的 CSS，很可能是静态的，他们不需要维护 fork，但是，现在很明显不 fork 是愚蠢的。

谢谢。

4 个赞
4

此主题在上次回复后 30 天自动关闭。不再允许回复。