동적 필드를 포함한 경로를 찾거나 상대 URL을 사용하는 방법

제품 지원
1

사용 중인 플러그인(Discourse Tab Bar)에 라우트를 추가하려고 하고 있는데, 메타에서 검색해도 관련되거나 이해하기 쉬운 내용을 찾지 못했습니다.

예를 들어 다음 URL로 이어지는 라우트 이름을 확인하려고 합니다:

domain.com/u/admin/follow/feed

미리 정의된 라우트 이름 또는 상대 URL을 사용할 수 있다는 것은 알고 있습니다. 여기서 질문이 있습니다:

  1. 모든 미리 정의된 라우트의 목록을 어떻게 찾을 수 있나요? (그런 목록이 실제로 존재한다면)

  2. URL에 사용자 이름(또는 그룹 이름과 같은 다른 동적 텍스트)이 포함된 경우, 상대 URL을 어떻게 사용할 수 있나요? 예를 들어 설정(Preferences) 패널의 URL 같은 경우입니다.

2

이것은 알고 있습니다. :slightly_smiling_face: /u/username을 my로 교체하면 일반적인 링크를 만들 수 있습니다.

예를 들어,

https://meta.discourse.org/u/jammydodger/preferences/account

은

https://meta.discourse.org/my/preferences/account

으로 변환됩니다.

https://meta.discourse.org/my/preferences/account

3

@JammyDodger님, 정말 많은 도움이 되었습니다.

LE: 제가 사용하는 테마인 https://meta.discourse.org/t/discourse-tab-bar-for-mobile/ 의 경우, 상대 URL을 사용할 때 활성화된 버튼의 색상이 변경되지 않는 문제가 있는 것 같습니다. 라우트 관련 답변을 계속 찾고 있습니다.

4

안녕하세요,

저도 Discourse Tab Bar와 Follow 플러그인을 사용 중입니다. /my/follow/feed URL을 Discourse Tab Bar에도 추가했는데, 제 포럼에서도 탭 활성화가 작동하지 않았습니다 :grin: 그래서 작동을 위해 작은 CSS 해킹을 적용했습니다.

현재 body 클래스인 .user-follow-page를 대상으로 지정하여 CSS 수정 사항을 팔로우 페이지로만 유지할 수 있습니다. 이 클래스를 사용하면 관련 Discourse Tab Bar 탭을 쉽게 지정할 수 있습니다.

해야 할 일은 고정된(active) 탭의 색상을 기본(비활성) 색상으로 변경하고, data-destination이 /my/follow/feed인 탭에 활성 탭 색상을 추가하는 것입니다.

data-destination은 Tab Bar 테마 컴포넌트에서 탭에 설정한 URL입니다.

이 내용을 새 컴포넌트의 모바일 CSS 섹션에 추가하세요.

body.user-follow-page {
  .d-tab-bar {
    .tab {
      &.active {
        color: var(--primary-medium);
      }
      &[data-destination="/my/follow/feed"] {
        color: var(--tertiary);
      }
    }
  }
}

아래 링크가 해당 목록인 것 같습니다. discourse/app/assets/javascripts/discourse/app/routes/app-route-map.js at 9d5da2b383765becb824a8f3ff3665abc8e527fa · discourse/discourse · GitHub

5

훌륭한 답변입니다. :heart: :awthanks: