Question

我尝试使用磁贴列表创建启动板应用，问题是当我点击磁贴时它可能是一个应用程序然后我导航到应用程序URL或它可能是一组应用程序或除了我需要导航到启动板的相同视图但使用新的切片列表之外的其他组。现在，我只想导航到单击图块时导航到相同的视图并使用幻灯片切换进行操作但是如果我创建一个具有相同默认路径目标的路径，则在启动应用程序时视图不会呈现，只有当我创建具有相同视图名称的其他目标时，才能使用该路径的目标。

我的清单的一部分在哪里：

 "routes": [
        {
          "pattern": "",
          "name": "group",
          "target": "group"
        },
        {
          "pattern": "group",
          "name": "group2",
          "target": "group2"
        }
      ],
      "targets": {
        "group": {
          "viewName": "TileGroup",
          "viewLevel" : 1
        },
        "group2": {
          "viewName": "TileGroup",
          "viewLevel" : 2
        }
      }
    }

这里是我TileGroup视图的控制器。

＆＃13;

sap.ui.define([
   "sap/ui/core/UIComponent"
],
sap.ui.controller("pelissari.soficom.launchpad.controller.TileGroup", {
	onInit: function() {
		var oModel = new sap.ui.model.json.JSONModel();
 		oModel.loadData("./model/data.json");
 		this.getView().setModel(oModel);
		
	},
		onPress: function (oEvent) {
			var oRouter = sap.ui.core.UIComponent.getRouterFor(this);
			oRouter.navTo("group2");
		}
	}));

＆＃13;

使用此代码，我认为导航正常，因为当我点击某个图块但该视图没有更改时，该应用的网址会发生变化。

Answer 1

如果您看到URL被更改，那么您已准备好解决方案的第一部分。唯一的事情是你不应该导航到新的目标。相反，您应该导航到同一目标，但使用navTo方法的第二个参数传递另一个tilegroup标识符，例如：

oRouter.navTo("tileView", {group: "group1"});

第二部分涉及在URL更改时在控制器中引发事件，以便您可以对更改采取行动。

要捕获使用navTo方法传递的ID，您应该相应地更改清单中的路由模式，例如：

"pattern": "tiles/:group:"

tiles表示您网址中的固定部分，而:group:指定名为group的可选参数。如果你想从根本做这个（我认为这是你打算做的），它应该是

"pattern": ":group:"

要通知路由器您希望在URL更改时触发，您可以设置回叫。您可以通过将以下代码插入控制器的onInit处理程序来完成此操作：

var oRouter = sap.ui.core.UIComponent.getRouterFor(this);
oRouter.getRoute("group").attachPatternMatched(this._onPatternMatched, this);

如果在onInit处理程序中，当涉及目标_onPatternMatched的URL发生更改时，将调用group处理程序。后者很有用，否则即使链接到控制器的视图不可见，也会触发每个URL更改的方法。

从_onPatternMatched方法，您应该回读应该显示的组ID，以便您可以更改切片。您可以通过从事件参数中读取arguments参数来执行此操作：

_onObjectMatched : function (oEvent) {
    var groupId =  oEvent.getParameter("arguments").group;
    console.log("Group ID: " + groupId);
},

UI5 walk-through步骤31，32和33详细说明了路由的基本要素。请特别注意第32部分，它解释了使用参数进行路由。

导航到相同的视图，但使用不同的参数

1 个答案: