사용 app 구성 요소
ofa.js에서는 o-app 컴포넌트를 사용하여 전체 애플리케이션의 레이아웃 구조를 생성하고 다양한 페이지 모듈을 로드할 수습니다. o-app 컴포넌트, o-page 컴포넌트 및 페이지 모듈을 사용하여 전체 애플리케이션의 페이지 구조를 구축하고 페이지 간의 탐색을 구현할 수 있습니다.
o-page 구성 요소가 o-app 내에 있을 때, 페이지 이동을 구현하기 위해 <a> 태그를 사용하고 olink 속성을 지정할 수 있습니다. 이러한 이동은 현재 페이지에 영향을 주지 않고 o-app 내에서만 이동되며, 마치 <iframe>을 사용하는 것과 유사합니다.
만약 o-page 컴포넌트가 o-app 내부에 있다면, 다음 방법을 사용할 수도 있습니다:
goto메서드를 사용하여 페이지 이동back메서드로 이전 페이지로 돌아가기- 현재 페이지를 바꾸려면
replace메서드를 사용합니다.
o-app 컴포넌트를 사용하면 전체 앱의 레이아웃 구조를 구축하고 여러 페이지 모듈을 로드 할 수 있습니다. 또한 o-app이 제공하는 라우팅 기능을 사용하여 페이지 간의 이동을 더 편리하고 유연하게 만들 수 있습니다.
이 예제에서는 o-app 컴포넌트를 사용하여 앱 레이아웃을 만들고 그 안에 page1.html 페이지 모듈을로드합니다.
page1.html 페이지 모듈에서 제목과 버튼을 정의하고 버튼을 클릭하면 다른 페이지 모듈 page2.html로 이동합니다. 또한 olink 속성을 가진 링크를 추가하며, 이를 클릭하면 마찬가지로 page2.html로 이동합니다.
'page2.html' 페이지 모듈에서도 제목과 버튼을 정의했습니다. 버튼을 클릭하면 이전 페이지로 돌아갈 수 있으며, 이로써 페이지 탐색을 구현할 수 있습니다.