플러그인 아웃렛에 컴포넌트 액션을 추가하는 방법?

개발
1

플러그인 아웃렛에서 기존 컴포넌트를 참조하려고 시도하고 있지만, 계속 오류가 발생합니다. 그리고 주요 문제는 해당 컴포넌트와 연관된 액션인 것 같습니다. 플러그인 아웃렛에서 다른 컴포넌트의 액션을 참조하는 올바른 방법이 있을까요?

플러그인 아웃렛에서 컴포넌트만 참조하면(예: {{component-name action=(action "doSomething")...}}), 해당 컴포넌트 액션의 관련 코드가 모두 가져와질 것이라고 생각했습니다. 하지만 그렇지 않은 것 같습니다. 특정 항목이 정의되지 않았거나, 정의가 부적절하다는 등의 다양한 오류가 계속 발생하며, 액션의 자바스크립트가 플러그인 아웃렛으로 제대로 가져와지지 않는다는 것을 암시하는 다른 문제들도 발생하고 있습니다.

예를 들어:

템플릿에 composer-action-title 컴포넌트에 대한 다음 참조가 있다고 가정해 보겠습니다:
composer.hbs:

 {{composer-action-title
       model=model
        openComposer=(action "openComposer")
        closeComposer=(action "closeComposer")
        canWhisper=canWhisper
        tabindex=8
  }}

그리고 플러그인 아웃렛을 추가하려고 하는데, 그 플러그인 아웃렛에 동일한 코드가 있다고 가정해 보겠습니다:

connectors/cool-outlet/cool-outlet.hbs:

 {{composer-action-title
       model=model
        openComposer=(action "openComposer")
        closeComposer=(action "closeComposer")
        canWhisper=canWhisper
        tabindex=8
  }}

cool-outlet 플러그인 아웃렛이 "openComposer"와 “closeComposer” 액션을 포함하여 composer-action-title 컴포넌트에 성공적으로 참조할 수 있도록 하기 위해 무엇을 해야 하나요?

2

이것의 기본적인 요점은 파악한 것 같습니다. 물론 다른 분들의 제안이 있다면 기꺼이 듣고 싶습니다.

플러그인 아웃렛에 액션과 기타 인수를 전달하려면, 컴포넌트 참조를 할 때와 마찬가지로 플러그인 아웃렛 참조에 추가할 수 있습니다.

다만, 올바른 인수를 전달하는지 주의하세요. 즉, 올바른 변수 참조를 전달하는 것입니다.

제 예를 들어 설명하겠습니다. composer.hbs 템플릿에 나타나는 컴포넌트 참조는 다음과 같습니다:

{{composer-action-title
       model=model
       openComposer=(action "openComposer")
       closeComposer=(action "closeComposer")
       canWhisper=canWhisper
       tabindex=8
  }}

이 참조를 플러그인 아웃렛 참조(discourse가 변경됨에 따라 유지보수가 어려워지므로 템플릿 파일을 편집할 때는 주의해야 함)로 대체하고, 플러그인 아웃렛 자체에서 composer-action-title 컴포넌트를 참조하도록 하려면, composer.hbs에 다음을 넣을 수 있습니다:

{{plugin-outlet name="cool-outlet" args=(hash 
       model=model
       openComposer=(action "openComposer")
       closeComposer=(action "closeComposer")
       canWhisper=canWhisper
       tabindex=8
    )
}}

그리고 connectors/cool-outlet/cool-outlet.hbs에서, 다음 코드는 composer-action-title 컴포넌트를 참조하는 데 사용될 수 있습니다:

{{composer-action-title
       model=model
       openComposer=openComposer
       closeComposer=closeComposer
       canWhisper=canWhisper
       tabindex=8
  }}

여기서 변수들은 composer.hbs 파일에서 설정된 변수들입니다.