灵活的列布局导航（SAPUI5）

我用SAPUI5创建了一个应用程序，它使用灵活的列布局

我试图在页面之间导航，但遇到了困难

以下是主要的xml视图：

<mvc:View id="Main" controllerName="SAP.demo.controller.Main" xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc"
displayBlock="true" xmlns="sap.f" xmlns:core="sap.ui.core" xmlns:m="sap.m">
<m:App id="idAppControl">
    <m:pages>
        <m:Page title="{i18n>title}">
            <m:content>
                <FlexibleColumnLayout id="fcl" initialMidColumnPage="start" layout="TwoColumnsBeginExpanded">
                    <beginColumnPages>
                        <m:Page title = "Master">
                            <m:content>
                                <Button text="Chart Button" press="displayChart"/>
                            </m:content>
                        </m:Page>
                    </beginColumnPages>
                    <midColumnPages>
                        <m:Page id="start" title = "Detail">
                            <m:content>
                                <core:Fragment fragmentName="SAP.demo.view.Start" type="XML"/>
                            </m:content>
                        </m:Page>
                        <m:Page id="charts" title="Charts">
                            <m:content>
                                <core:Fragment fragmentName="SAP.demo.view.Charts" type="XML"/>
                            </m:content>
                        </m:Page>
                    </midColumnPages>
                </FlexibleColumnLayout>
            </m:content>
        </m:Page>
    </m:pages>
</m:App>

---

有人能告诉我我做错了什么，因为即使我按下按钮，它仍会停留在起始页上

这是因为视图的真实ID不是“charts”，而是“_xmlview0--charts”。 始终注意ID，并使用API方法

byId（'theidher'）

在您的情况下，请使用以下选项之一：

displayChart:function(oEvent){
   this.getView().byId("fcl").toMidColumnPage(this.getView().byId("charts"));
}

或

并将正确的XML名称空间添加到按钮中

<m:Button text="Chart Button" press="displayChart"/>

---

这是因为视图的真实ID不是“图表”，而是“图表”。 始终注意ID，并使用API方法

byId（'theidher'）

在您的情况下，请使用以下选项之一：

displayChart:function(oEvent){
   this.getView().byId("fcl").toMidColumnPage(this.getView().byId("charts"));
}

或

并将正确的XML名称空间添加到按钮中

<m:Button text="Chart Button" press="displayChart"/>

---

成功地用以下代码修复了它：

displayChart: function () {
    this.byId("fcl").toMidColumnPage(this.createId("charts"));
},

---

已使用以下代码修复此问题：

displayChart: function () {
    this.byId("fcl").toMidColumnPage(this.createId("charts"));
},

---

您的视图可能正在包装ID，您应该尝试用

this.getView（）.createId（“图表”）替换
“图表”
。您的视图可能正在包装ID，您应该尝试用
this.getView（）.createId（“图表”）替换
“图表”