Show Menu
화제×

백본 상호 작용

백본은 웹 애플리케이션에서 MVC 아키텍처를 만들고 따르는 데 도움이 되는 라이브러리입니다. 백본의 기본 아이디어는 모델을 기반으로 하여 인터페이스를 논리적 뷰로 구성하는 것입니다. 모델은 페이지를 다시 그릴 필요 없이 모델이 변경될 때 개별적으로 업데이트할 수 있습니다. 백본에 대한 자세한 내용은 https://backbonejs.org을 참조하십시오 .
몇 가지 주요 개념은 다음과 같습니다.
백본 모델데이터와 이 데이터와 관련된 대부분의 논리를 포함합니다.
백본 보기 해당 모델의 상태를 나타내는 데 사용됩니다. 백본 보기는 실제로 컨트롤러와 같이 동작하며, 사용자 클릭과 같은 사용자 인터페이스 이벤트를 수신하거나, 이벤트(예: 변경된 데이터)를 모델링하고, 사용자 인터페이스를 적절하게 수정합니다.
HTML 템플릿 모델로 채워진 자리 표시자가 있는 래퍼 템플릿입니다.
AEM Forms 작업 영역에는 여러 개의 개별 구성 요소가 포함되어 있습니다. 각 구성 요소:
  • 단일 논리 사용자 인터페이스 요소를 나타냅니다.
  • 유사한 구성 요소의 컬렉션이 될 수 있습니다.
  • 백본 모델, 백본 보기 및 HTML 템플릿으로 구성됩니다.
  • 서비스에 대한 참조를 포함합니다.
  • 필수 유틸리티에 대한 참조를 포함합니다.
구성 요소가 초기화되면 다음 개체가 만들어집니다.
  • 구성 요소에 대한 백본 모델의 새 인스턴스가 생성됩니다. 모델에 서비스가 주입됩니다.
  • 백본 보기의 새 인스턴스가 만들어집니다.
  • 해당 모델, HTML 템플릿 및 유틸리티의 인스턴스가 보기에 삽입됩니다.
백본 보기에서는 해당 처리기와의 사용자 인터페이스 상호 작용으로 인해 발생할 수 있는 다양한 이벤트를 매핑하는 이벤트 맵이 있습니다. 이 매핑은 구성 요소가 초기화되면 시작됩니다.
뷰가 초기화되면 뷰에서 해당 모델을 호출하여 서버에서 데이터를 가져옵니다. 뷰에 필요한 모든 데이터를 사용할 수 있게 되면 HTML 템플릿에서 지정한 형식으로 데이터가 렌더링됩니다. 여러 보기가 통신에 대해 동일한 모델을 공유할 수 있습니다.
예:
  1. 사용자가 작업 목록에서 작업 템플릿을 클릭합니다.
  2. 작업 보기는 클릭을 수신하고 작업 모델에서 렌더링 함수를 호출합니다.
  3. 이후 작업 모델은 AEM Forms 서버와의 모든 통신에 공통인 서비스를 호출합니다.
  4. 서비스 클래스는 ajax를 통해 렌더링 메서드에 대해 AEM Forms REST 끝점을 호출합니다.
  5. 이 Ajax 호출에 대한 성공 콜백은 작업 모델에서 정의됩니다.
  6. 작업 모델은 렌더링 호출이 완료되었다는 알림으로서 백본 이벤트를 발생시킵니다.
  7. 다른 보기에서는 작업 세부 사항 보기가 작업 모델에서 이 이벤트를 수신합니다.
  8. 그런 다음 작업 세부 사항 보기를 통해 작업 세부 사항 템플릿을 변경하여 렌더링된 작업(양식, 세부 사항, 첨부 파일, 노트 등)을 사용자에게 표시합니다.