안녕하세요! routing 썸네일형 리스트형 [ SAPUI5 ] Navigation and Routing - 10 ○ contents를 포함하지 않는 tab 숨기기 - [Resume.view.xml] 1) 'lazy loading' : 'id'를 이용해 라우팅 구성에서 나중에 처리 가능토록 함 2) 많은 콘텐츠를 포함하거나 백엔드 서비스에 대해 비용이 많이 드는 서비스 호출을 trigger하는 tab에 사용 - [ResumeHobbies.view.xml] / [ResumeNotes.view.xml] - [Resume.controller.js] 1) 'oQuery'에서 선택한 'tab'이 'Hobbies'이거나 'Notes'일 때 2) 해당 경로의 target을 'resumeTab'과 선택한 'oQuery'의 'tab'을 합쳐서 표현 * 'resumeTabHobbies', 'resumeTapNotes'로 표시 - [m.. 더보기 [ SAPUI5 ] Navigation and Routing - 6 ○ 직원 리스트 화면에 출력하기 - [Home.view.xml]에서 'id'를 'employeeListBtn'로 하고 'class'를 'sapUiTinyMarginEnd'로 지정하는 버튼 입력 - 'onNavToEmployees' 핸들러에 'employeeList'를 매개로 'getRouter()'의 'navTo()' 메서드 호출해 경로 지정 - [manifest.json] 1) 'sap.ui.demo.nav.view.employee.EmployeeList' view를 통해 직원 리스트 불러오기 2) 'level'을 '2'로 설정해 왼쪽으로 슬라이드되며 화면이 전환되도록 함, 뒤로가기 시에는 오른쪽으로 슬라이드 - [EmployeeList.view.xml] 1) 'List' 안에 [manifest.jso.. 더보기 [ SAPUI5 ] Navigation and Routing - 5 ○ 뒤로가기 버튼을 눌러 Home.view로 되돌아가기 - [Home.view.xml] - [Home.controller.js] 1) onDisplayNotfound 핸들러 기능 설정 2) 'getRouter()' 메서드에서 getTargets() 메서드를 불러와 'display("notFound")' 호출 * 'name'이 'notFound'로 연결된 view는 Hash를 변경하지 않고 라우터를 통해 표시됨 * 'getTargets()' 호출로 'sap.m.routing.Targets' 객체를 가져옴 3) Not Found Button을 누르면 URL을 변경하지 않고 'notFound'가 표시됨 - [Home.controller.js]의 'display("notFound")'에 'fromTarget'을.. 더보기 [ SAPUI5 ] Navigation and Routing - 4 ○ 뒤로가기 버튼 구현하기 - [NotFound.view.xml] 1) 'showNavButton'을 'true'로 설정해 뒤로가기 Button을 자동으로 표시 2) 'navButtonPress'를 'onNavBack'로 설정해 실제 뒤로가기 기능 구현 가능케 하기 - [BaseController.js] 1) onNavBack 핸들러를 통해 앱 기록에 이전 해시값이 있는지 확인 2) 브라우저의 기본 History API를 통해 이전 해시로 redirection 3) 변수 'oHistory', 'sPreviousHash' 지정 * oHistory : 'History'를 매개로 인스턴스(객체)화 * sPreviousHash : 'oHistory'의 이전 해시값을 가져오는 'getPreviousHash()' .. 더보기 [ SAPUI5 ] Navigation and Routing - 3 ○ 'NotFound' 우회 페이지 구현 - 'bypasssed' 1) 'notFound'로 설정해 라우팅 구성 확장 2) 라우터가 현재 해시와 일치하는 경로가 없는 경우, ,notFound, 대상 표시하도록 지시 3) 우회 section에 'notFound' 대상 추가 및 단순 'notFound' view로 전환되도록 구성 - [NotFound.view.xml] - [NotFound.controller.js] - [i18n.properties] - 야발...... - 이유는 도큐먼트에서 안내되는 코드와 달랐다.. 이런... 됐으니 넘어가자 일단... Next Stage : Navigation and Routing - 4 https://pythonchoboman.tistory.com/102 SAPUI5 .. 더보기 [ SAPUI5 ] Navigation and Routing - 2 ○ 기본 view 만들기 - config 1) 모든 경로 및 대상에 적용되는 전역 라우터 구성 및 기본값이 포함되어 있음 2) sap.ui.core.routing.Router을 기본값으로 하여 routerClass 설정 * 앱에서 view가 있는 위치 정의 * view를 자동으로 로드하고 표시하기 위해 페이지를 표시하는 데에 사용되는 컨트롤 id와 새 페이지가 표시될 대 채워지는 Aggregation도 지정 * 'viewType' : 'XML'로 설정 * 'path' : namespace 'sap.ui.demo.nav'의 view 폴더를 사용해 모든 view 구현 - routes 1) 각 경로에 도달했을 때 탐색할 'patern', 'name', 'target' 정의 2) 'pattern'은 경로와 일치.. 더보기 [ SAPUI5 ] Routing and Navigation ○ manifest.json - config 1) 모든 경로 및 대상에 적용되는 전역 라우터 구성 및 기본값 포함 2) view를 자동으로 로드하고 표시하기 위한 컨트롤 지정 - routes 1) 기본 경로 2) 새 페이지를 표시하는 URL 패턴 세부 정보가 있는 세부 경로 - targets : target에 해당하는 view 로드 및 앱에 표시 ○ component.js ○ Overview.view.xml ○ App.view.xml ○ InvoiceList.controller.js 더보기 이전 1 2 다음
