Создаем приложение UI5.
Главное представление называем app. Добавляем еще два представление, и контроллеры к ним.
Представлению app присваиваем ID и устанавливаем свойство displayBlock=”true”
ищем файл Component.js
Добавляем в него строку
1 2 |
//init routing this.getRouter().initialize(); |
Ищем файл manifest.json
Объявляем routes
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
"routing": { "config": { "routerClass": "sap.m.routing.Router", "viewType": "XML", "viewPath": "RoutingDemo.view", "targetAggregation": "pages" }, "routes": [{ "pattern": "", "name": "view1", "view": "view1", "targetAggregation": "pages", "controlId": "app" }, { "pattern": "View2", "name": "view2", "view": "view2", "targetAggregation": "pages", "controlId": "app" }] } |
Добавляем в представление view1 кнопку с обработчиком события, для перехода на второе представление.
1 |
<Button text="Button" width="100px" id="__button1" press="OnClick"/> |
В контроллере создаем функцию, и пишем код для перехода
1 2 3 4 |
OnClick: function() { var oRouter = sap.ui.core.UIComponent.getRouterFor(this); oRouter.navTo("view2"); } |
Чтобы вернуться на предыдущую страницу
1 2 3 |
NavPress: function() { history.go(-1); } |
Для передачи параметра из одной view в другую
1 |
oRouter.navTo("view2", {value:"значение"}); |
в manifest.json
1 2 3 4 5 |
"pattern": "View2/{value}", "name": "view2", "view": "view2", "targetAggregation": "pages", "controlId": "app" |