2016-09-20 8 views
2

제 질문은 Maquette 자바 스크립트 프레임 워크의 구성 요소 간 통신에 대한 것입니다.Maquette의 구성 요소 간 통신

가 나는 Application 구성 요소에 사용되는 Menu 하위 구성 요소를 상상해 : 메뉴 항목 (예를 들어) 응용 프로그램에 표시되는 주요 내용을 교환하기 위해 Menu 인스턴스를 선택한 경우 Application 인스턴스가 알고 싶다 . 즉, 하위 구성 요소와 상위 구성 요소 간의 통신 방법이 필요합니다. 이것이 Maquette에서 어떻게 성취 될 수 있습니까?

확실히, 응용 프로그램 인스턴스가 소유 한 콜백을 메뉴 인스턴스에 전달할 수 있습니다.이 인스턴스는 항목이 선택 될 때 호출됩니다. 그러나 "선택"이벤트가 메뉴 구성 요소의 "렌더링 측"측면 일 뿐이므로 조금만 꺼려합니다. 따라서 Menu API로 누출되지 않고 이벤트가 렌더링 내부에 있어야합니다. 함수/메소드를 대신 사용합니다.

"렌더링 측"에서 이벤트를 처리하고 싶습니다. 하지만 의 렌더링 함수에서 CustomEvent을 보내야하고 Application의 렌더 함수 내에서 CustomEvent 처리기를 등록해야한다는 것을 알 것입니다. 이 use-case가 maquette에서 지원됩니까? 제 사용의 경우에 CustomEvent의 다른 대안이 있습니까?

감사합니다!

추 신 : 더 많은 답변을 얻으려면 티켓 #71에서 PS : 질문을 다시 게시하십시오.

답변

1

우리가 일반적으로하는 일은 항목을 클릭 할 때 호출되는 구성 요소에 콜백을 전달하는 것입니다. 예를 들어 콜백 menuItemClicked(menuItem: MenuItem)으로 메뉴를 구성 할 수 있습니다. Imho는 메뉴/메뉴 항목에 응용 프로그램 별 지식이 누출되지 않습니다. 메뉴의 작성자는 라우팅이나 변수 변경과 같은 콜백 내부의 모든 작업을 수행 할 수 있습니다.

이벤트 시스템도 가능합니다. DOM 계층 구조를 사용하여 이벤트를 버블하는 것은 권장하지 않습니다. 나는 Applicationmenu = createMenu(...)을 사용하여 메뉴를 만들고 나서 menu.addEventListener('itemClicked', navigate) 또는 뭔가를 호출하는 것을 상상할 수 있습니다.

+0

왜 DOM 계층 구조를 사용하지 않는 것이 좋습니까? 성능 문제 때문에? –

+0

DOM 계층 구조를 사용하면 불필요하게 복잡해질 것이라고 생각합니다. 그러나 그것이 사실인지 궁금합니다. 어쩌면 당신은 이것을 달성하는 방법을 보여주기 위해 jsfiddle 또는 codepen을 만들 수 있습니까? –

+0

현재 선택된 항목이 클릭 이벤트 처리기 외부에서 프로그래밍 방식으로 변경되면 트리거 될 이벤트가 필요할 수도 있다는 것을 알고 있습니다. 따라서 렌더링 측면 전용 이벤트 일 수 없습니다. 나는 마침내 당신의 대답이 갈 길이라고 생각합니다. –