Fiori navigation logic ( Route )

简介: 对于Fiori的developer来说,要在代码里做view之间的navigation很简单,就做一些配置,然后call 一行代码,思路非常像webclient ui里的inbound和outbound plug。不过如果搞清楚底层到底怎么work的比较好。

对于Fiori的developer来说,要在代码里做view之间的navigation很简单,就做一些配置,然后call 一行代码,思路非常像webclient ui里的inbound和outbound plug。不过如果搞清楚底层到底怎么work的比较好。


貌似这套东西是SAP 从其他地方copy的,因为所有代码都在thirdparty folder下。

image.png

UI5 view之间navigation的核心代码在folder resources/sap/ui/thirdparty里的js实现。


如上图所示,router framework试图根据传入的route request “detail/AccountCollection(‘4039331’)” 来获取一条匹配的route path.


问题1: 这个request是怎么传到route framework的?

answer:在我们自己的application view里传递的。当我们点击navigation list时,框架自动调用我们注册的事件处理函数setListItem, 在line 124将当前待显示的detail page的上下文,所谓的contextPath,即"detail/AccountCollection(‘4039331’)"通过调用route框架的方法navTo传入route框架

image.png

问题2: route framework 具体的匹配逻辑


image.png



问题3: route framework里匹配的三条记录从哪里来的

answer: 在project的component.js里:


image.png

注意上面有两个hard code的detail,其含义不一样。先把第二个detail改成mydetail:


image.png


第三条匹配生效了:


image.png


此时由于application code里调用navTo时仍然传的是detail,因此找不到匹配的route,点击list里每个item后将没有任何效果-浏览器里地址栏没有发生变化,表明没有发生navigation。


image.png


如果将application code里的detail也改成mydetail之后,仍然不work:

原因是this._oRoutes object里没有名为mydetail的attribute:

image.png

改成如下之后:


image.png


之后就能找到名为mydetail的route:


image.png


从地址栏观察到navigation重新起作用了


image.png


相关文章
|
2月前
|
UED
什么是 SAP Commerce Cloud SmartEdit Product Carousel Component Editor
什么是 SAP Commerce Cloud SmartEdit Product Carousel Component Editor
|
JavaScript
Fiori navigation logic ( Route )
Fiori navigation logic ( Route )
Fiori navigation logic ( Route )
Fiori Launchpad etag retrieve logic - UI5 Repository
Created by Wang, Jerry, last modified on Jan 15, 2015
Fiori Launchpad etag retrieve logic - UI5 Repository
|
前端开发 Java
SAP Commerce的路由实现(Route Implementation)
SAP Commerce的路由实现(Route Implementation)
SAP Commerce的路由实现(Route Implementation)
SAP Fiori Elements - smart filter bar study - filter display logic
SAP Fiori Elements - smart filter bar study - filter display logic
128 0
SAP Fiori Elements - smart filter bar study - filter display logic
SAP Fiori:why my filter by titleID does not work
SAP Fiori:why my filter by titleID does not work
114 0
SAP Fiori:why my filter by titleID does not work
footer bar in SAP Fiori as a service
footer bar in SAP Fiori as a service
91 0
footer bar in SAP Fiori as a service
SAP Smart Business design time = CDS view SADL
SAP Smart Business design time = CDS view SADL
124 0
SAP Smart Business design time = CDS view SADL
|
JavaScript
UI5 navigation logic
Created by Jerry Wang, last modified on Jan 29, 2015
UI5 navigation logic
Smart Business design time = CDS view + SADL
Smart Business design time = CDS view + SADL
Smart Business design time = CDS view + SADL