如何在UI5上切换视图时正确匹配路由?

时间:2018-01-17 16:15:55

标签: javascript routing sapui5

我有一个包含多个页面的SAPUI5应用程序。我的一个视图控制器上有以下代码。

    onInit : function () {
        var route = sap.ui.core.UIComponent.getRouterFor(this);
        route.attachRouteMatched(this.initController, this);            
    },

    initController: function(evt){

        tableControls = ViewControls.tableViewControls.apply(this);

        //update data row first
        var updateRowFlag = ViewControls.getUpdateRowFlag();

        if(updateRowFlag){
             var rowData = ViewControls.getRowData();
             rowData = rowData[0];
             ViewControls.updateSummaryData(rowData);
        }

        data = ViewControls.getSummaryData();
        this.setPaginationData();            
    },

上面的代码打算做的是当我导航到这个页面时,路由器将触发事件并调用initController()来调用上面显示的所有数据绑定和其他内容。我遇到的问题是,当我进入该页面时,我只希望它被触发。但是,当我从这个视图导航到其他视图时,它也会被触发。当我这样做时,initController()会在离开之前再次被调用,这会导致延迟。

这是我的component.js

中的路由
metadata: {
        rootView: "myApp.view.App",
        routing: {
            config: {
                routerClass: "sap.m.routing.Router",
                viewPath: "myApp.view",
                controlId: "rootControl",
                controlAggregation: "pages",
                viewType: "XML"
            },
            routes: [
                {
                    name: "page1",
                    // empty hash - normally the start page
                    pattern: "",
                    target: "page1"
                },
                {
                    name: "page2",
                    pattern: "Page2",
                    target: "page2"
                },
                {
                    name: "page3",
                    pattern: "Page3",
                    target: "page3"
                }
            ],
            targets: {
                page1: {
                    viewName: "InputsView",
                    viewId:"InputsView",
                    viewLevel: 0
                },
                page2: {
                    viewName: "TableView",
                    viewId:"TableView",
                    viewLevel: 1
                },
                page3: {
                    viewName: "DetailsView",
                    viewId:"DetailsView",
                    viewLevel: 3
                }
            }
        }

1 个答案:

答案 0 :(得分:2)

替换

var route = sap.ui.core.UIComponent.getRouterFor(this);
route.attachRouteMatched(this.initController, this);

sap.ui.core.UIComponent.getRouterFor(this).getRoute(<yourRouteName>).attachMatched(this.initController, this);

然后只有当你到达指定的路线时才匹配