导航时在控制器之间传递数据 [英] Passing Data Between Controllers While Navigating

问题描述

我想在两个控制器之间传递数据(除了路由参数)，我想知道这样做的正确方法.

I want to pass data between two controllers (in addition to routing parameters) and I would like to know the correct way to do this.

例如:当我导航到模式 /order/{id} 时，我在视图控制器中执行此操作:

For example: when I navigate to pattern /order/{id}, I do this in the view controller:

this.getRouter().navTo("order", {
  id: sOrderId
});

我想传递额外的 JSON 对象，我不想成为路由参数的一部分.

I want to pass additional JSON object which I don't want to be part of routing parameter.

这种情况我该怎么办?

--编辑
想添加我喜欢用这个实现的目标

我想将数据从 master 传递到 detail.主页面和详细页面都分配了单独的路由模式.所以用户可以直接登陆主或细节.当他们登陆 master 时 - 用户可以选择一堆细节项目，并导航到第一个细节项目，然后从那里导航到他/她之前在 master 上选择的其他项目.所以我想传递的是这个从主控制器到细节控制器的选择.

I want pass data from master to detail. Both master and detail page has individual routing patterns assigned. So user can land on master or detail directly. When they land on master - user can choose bunch of detail items, and navigate to first detail item, and from there navigate to other items he/she selected earlier on master. So what I want to pass is this selection from master controller to detail controller.

推荐答案

注意: 如果打算将选定的键从主视图传递到详细视图，请参见 https://stackoverflow.com/a/48870579/5846045 代替.

Note: If the intention is to pass selected keys from the main view to the detail view, see https://stackoverflow.com/a/48870579/5846045 instead.

通常，数据单独存储在模型中，而不是分配给局部变量并传递它们.然后模型数据可以与任何可以访问模型的东西共享(例如数据绑定的视图).这是客户端 JSONModel 的示例:

Usually, data are stored separately in models instead of assigned to local variables and passing them around. Model data can be then shared with anything that can access the model (e.g. View for data binding). Here is an example with a client-side JSONModel:

1. 创建一个在父 ManagedObject 上设置的客户端 JSONModel.例如.通过 manifest.json 在组件上:

1. Create a client-side JSONModel which is set on a parent ManagedObject. E.g. on Component via manifest.json:

"sap.ui5": {
  "models": {
    "myModel": {
      "type": "sap.ui.model.json.JSONModel"
    }
  }
}

在控制器A中，设置对象在导航前通过:

In controller A, set the object to pass before navigating:

const dataToPass = /*...*/
this.getOwnerComponent().getModel("myModel").setProperty("/data", dataToPass);

在控制器 B 中，对传递的数据进行处理.例如.在 patternMatched 处理程序上:

In controller B, do something with the passed data. E.g. on patternMatched handler:

onInit: function() {
  const orderRoute = this.getOwnerComponent().getRouter().getRoute("order");
  orderRoute.attachPatternMatched(this.onPatternMatched, this);
},

onPatternMatched: function() {
  /*Do sth with*/ this.getOwnerComponent().getModel("myModel").getProperty("/data");
},

使用 NavContainer(Child) 事件

有几个与导航相关的事件，例如导航,BeforeHide, BeforeShow 等包含两个视图 - 源视图 (from) 和目标视图 (to).

Using NavContainer(Child) Events

There are several navigation-related events such as navigate, BeforeHide, BeforeShow, etc. which contain both views - the source view (from) and the target view (to).

您可以使用 API data 传递数据.下面是一个例子:

You can make use of the API data to pass the data. Here is an example:

1. 在控制器 A

onInit: function() {
  this.getView().addEventDelegate({
    onBeforeHide: function(event) {
      const targetView = event.to;
      const dataToPass = /*...*/
      targetView.data("data", dataToPass);
    }
  }, this);
},

在控制器 B

onInit: function() {
  this.getView().addEventDelegate({
    onBeforeShow: function(event) {
      /*Do sth with*/ this.getView().data("data");
    }
  }, this);
},

---

相关文档主题: 传递数据时导航

这篇关于导航时在控制器之间传递数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！