페이지 렌더링 후 코드 실행하는 방법

개발
1

span.category-topics--posts-count에서 괄호를 제거하고 싶습니다 (https://github.com/discourse/discourse-right-sidebar-blocks에서 렌더링됨). 이 api.onPageChange() 호출을 시도하고 있지만, countSpans을 전혀 가져오지 못하고 있습니다. 다른 테마 구성 요소가 페이지에 요소를 추가하기 전에 실행되고 있기 때문이라고 생각합니다.

어떻게 해야 할까요? :crying_cat:


  api.onPageChange(() => {
    console.log("page changed");

    const countSpans = document.querySelectorAll(
      "span.category-topics--posts-count"
    );
    console.log("spans", 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

그렇게 될 것 같지 않습니다.

이 작업은 CSS를 통해 또는 Ember 실행 루프 내에서 수행해야 합니다.

그 컴포넌트를 포크해서 다른 이름으로 원하는 대로 커스터마이징한 후, 별도의 테마 컴포넌트를 로드하고 RSB에서 이름으로 추가하는 것을 막는 것이 무엇인가요?

3

대부분 게으름 때문이야. 처음 시작했을 땐 아마 정적일 가능성이 높은 작은 css일 뿐이라 포크를 유지보수할 필요가 없을 거라고 생각했거든. 하지만 지금은 포크하지 않는 게 명백히 멍청한 일이야.

감사해