검색 결과 수정

개발
1

검색 결과(오른쪽 위 확대경 클래스에서 드롭다운으로 표시되는 것)의 스타일링을 일부 조정하고 싶습니다. 그런데 이것이 템플릿을 사용하는 대신 컴포넌트를 온더플로 생성하는 것 같습니다(app/assets/javascripts/discourse/app/lib/search.js). 다음과 같은 코드를 실행할 수 없는 것 같습니다.

      api.modifyClass("component:search-result-post", {
        didInsertElement() {
          this._super(...arguments);

        },
      });

또는 이와 유사한 방식으로요.

생성된 HTML의 일부를 수정할 수 있는 트리거나 이벤트를 어떻게 얻을 수 있을까요?

2

Richard님, 안녕하세요.

원하시는 수정 사항에 대해 좀 더 자세히 설명해 주시겠어요?

시작점으로, 다음과 같이 시도해 보시는 것이 좋을 것 같습니다:

api.reopenWidget(`search-result-post`, {
    html(attrs) {
        //
    }
})

여기서는 post를 사용했지만, tag, category, group, user, topic도 사용할 수 있습니다.

3

도와주셔서 감사합니다!!!

4

업데이트: 해당 위젯의 HTML 생성 로직이 꽤 복잡했고 외부 의존성이 많았습니다. 또한 그 모든 코드를 플러그인에 복사하고 싶지 않았기 때문에 결국 이렇게 구현했습니다

      api.reopenWidget(`search-result-topic`, {
        html(attrs) {
          const html = this._super(attrs);
          // 필요에 따라 html 수정
          return html;
        }
      });

이미 생성된 HTML을 수정하는 방식이 가장 우아한 방법은 아닐 수 있지만, 코어에서 플러그인으로 대량의 코드 블록을 복사할 필요가 없어졌고, 덕분에 향후 코어 업데이트에 대해 플러그인이 더 견고해졌습니다.

5

네, 저도 직접 시도해 보면서 그걸 알아차렸어요. 여기서는 선택지가 많지 않을 거라고 생각해요.