为什么它不显示两列？

Question

我正在尝试在我的应用程序上使用 Flexible Column Layout，但我遇到了路由问题。然而它并没有在屏幕上显示预期的结果。

路由定义如下：

"routing": {
        "config": {
            "routerClass": "sap.f.routing.Router",
            "viewType": "XML",
            "async": true,
            "viewPath": "com.example.RequestAccess.view",
            "controlId": "fcl",
            "transition": "slide",
            "bypassed": {}
        },
        "routes": [{
            "pattern": "jobprofile",
            "name": "jobprofile",
            "target": [
                "JobProfileSelector",
                "JobProfileOrder"
            ]
        }, {
            "pattern": ":layout:",
            "name": "authorize",
            "target": [
                "Authorization"
            ]
        }],
        "targets": {
            "Authorization": {
                "viewName": "Authorization",
                "controlAggregation": "beginColumnPages"
            },
            "JobProfileOrder": {
                "viewName": "JobProfileOrder",
                "controlAggregation": "midColumnPages"
            },
            "JobProfileSelector": {
                "viewName": "JobProfileSelector",
                "controlAggregation": "beginColumnPages"
            }
        }
    }
},

当我打电话时

var oRouter = this._getRouter();
oRouter.navTo("jobprofile");

它显示一列布局而不是两列。我希望是两列，因为我定义了：

"pattern": "jobprofile",
"name": "jobprofile",
"target": [
    "JobProfileSelector",
    "JobProfileOrder"
]

路径的两个目标 /jobprofile。我希望该应用程序应如下所示：

我做错了什么？

更新

我创建了一个示例应用 https://github.com/softshipper/fclpoc。点击 Go to jobprofile

您将重定向到页面 /jobprofile 路径。在这里，我期望它会向我展示 Second 和 Third 视图，就像主细节视图一样。

Answer 1

您必须调整 FlexibleColumnLayout 的属性 layout 才能拥有 1、2 或 3 列。默认为 1。

在您的根视图中，您已经对此属性进行了绑定，这是个好主意。

<FlexibleColumnLayout id="fcl"
                stateChange="onStateChanged"
                layout="{/layout}"
                backgroundDesign="Solid">
            </FlexibleColumnLayout>

但是，您没有从 App.controller.js 的任何地方调用函数 _updateLayout。

我建议重构此控制器以根据活动路线调整布局。

为什么它不显示两列？

Why it does not show two columns?

sapui5