{{d-button}}인지 <DButton>인지? 그것이 문제다

개발
1

DButton no longer supports @action as a string. Please refactor to use an closure action instead 토론을 이어서:

이것이 제게 큰 도움이 되었습니다!

그리고 이제 제 질문은 (9개월이 걸린 이유도 있지만) {{d-button}}와 <DButton>을 언제, 어떻게 사용해야 하는지입니다.

2

모던한 Ember 패턴은 컴포넌트를 호출할 때 ‘앵글 브래킷’ 구문을 사용하는 것입니다. 따라서 <DButton> 사용이 권장됩니다.

코어에서는 이를 린트로 검사하지만, 아직 테마/플러그인까지 확장하지는 않았습니다.

3

아. 다행이네요. 제가 그렇게 생각했거든요!

에러 메시지는 <DButton>에 대해 경고했지만, 저는 {{d-button}}을 사용 중이라 특히 혼란스러웠습니다. 이제 바로 수정하겠습니다.

아하. 설명해 주셔서 감사합니다.

4

잠깐. 그러니까 <DButton>에서 @actionParam을 포기하고 이렇게 값을 전달하는 거군요:

        @action={{fn this.addExtraVars this.extraVarsSmtp}}

근데 <NavItem>에서는 여전히 라우트로 매개변수를 전달하기 위해 이렇게 하고 있네요:

            @route="pfaffmanager.servers.show"
            @routeParam={{server.id}}
5

여기서는 특별한 경우입니다.

<NavItem>는 <LinkTo>를 호출하는데, 이 컴포넌트는 링크할 루트의 이름(route)과 동적 세그먼트를 채울 값(여기서는 ID인 model)을 별도로 전달받아야 합니다.

<LinkTo
    @route={{@route}}
    @model={{@routeParam}}
  >{{this.contents}}
</LinkTo>

이해가 되시나요?

6

설명 자체는 잘 되어 있고 나도 이해는 하지만, 그게 이치에 맞다고 하기는 어렵겠네요. :slight_smile:

7

여기서는 함수/액션이 관여되지 않기 때문에(그리고 필요도 없기 때문에) NavItem.에 그런 방식을 쓰는 것이 합리적입니다. 컴포넌트 간에 파라미터를 전달하는 것만 원할 뿐이죠. 제 의도를 이해하시나요? 설명을 잘 못해서 죄송합니다. :sweat_smile: