在SAPUI5应用中应用MVC

  • 本文关键字:应用 MVC SAPUI5 sapui5
  • 更新时间 :
  • 英文 :


所以基本上我在SAPUI5中有一个拆分页面,并且有几个母版页面和详细页面附加到它。我没有问题做整个事情在一个javascript文件,但由于文件变得太大,太难阅读,我想应用MVC设计到这个应用程序,并将每个页面分成一个视图和控制文件。下面是我的例子:

var oSplitApp = new sap.m.SplitApp({
    masterPages : [ page1, page4, page5],
    detailPages : [ page0, page2, page3 ],
    initialMaster : "page1",
    initialDetail : "page0"
});

和页面类似:

var page0 = new sap.m.Page("initialPage", {});
var page1 = new sap.m.Page({
    enableScrolling : true,
    footer : new sap.m.Bar({
        id : 'page1_footer',
        contentMiddle : [ new sap.m.Button({
            text: "Add"
        })]
    }),
    content : [ oTable = new sap.m.Table("items", {
        inset : true,
        visible : true,
        getIncludeItemInSelection : true,
        showNoData : false,
        columns : [ new sap.m.Column({
            styleClass : "name",
            hAlign : "Left",
            header : new sap.m.Label({
                text : "something"
            })
        }) ]
    }) ]
});
var template = new sap.m.ColumnListItem({
    type : "Navigation",
    visible : true,
    selected : true,
    cells : [ new sap.m.Label({
        text : "{name}"
    }) ]
});

等等…而且每个页面都有它的on attachPress功能,所以当你点击按钮或链接时,会发生一些事情,其他页面也会启动。请详细告诉我怎么做?

提前感谢您的帮助

你可以通过为每个Master/Detail创建自己的View/Controller来做到这一点。在你的视图中,在你的oSplitApp被构建的地方,你可以像这样实例化你的主/细节视图:

// load your external view/controller:
var page1 = sap.ui.jsview("path-to.DetailView1");
var oSplitApp = new sap.m.SplitApp({
    masterPages : [ page1, page4, page5],
    detailPages : [ page1, page2, page3 ],
    initialMaster : "page1",
    initialDetail : "page0"
});

例如,你的外部视图文件可以在createContent中返回sap.m.Page对象。

希望这对你有帮助。

最新更新