如何在SAPUI5中使用锚标记进行导航？

Question

我知道如何使用html和JavaScript

<h2 id="C4">Chapter 4</h2>
<a href="#C4">Jump to Chapter 4</a>

这就是我在SAPUI5中尝试的内容。点击返回顶部链接，它应导航到helpButton。这不适合我。

<Button id="helpButton" icon ="sap-icon://sys-help" />
<Link text="Back to top"
      press="#helpButton"/>

Answer 1

您可以在UI5中实际执行此操作。与你尝试的方式略有不同。

问题是UI5 ID与HTML ID不同（这是您希望与浏览器跳转的哈希链接一起使用）。此外，您无法在链接的press“属性”中指定URL。 press“属性”实际上是一个事件（因此您只能指定事件处理程序名称）。

因此，为了能够执行您想要的操作，您必须使用Link的href属性并使用目标控件的HTML ID填充它。您可以在视图的onAfterRendering挂钩上执行此操作（当您能够找到目标控件的HTML ID时）：

onAfterRendering: function() {
    var oRef = this.byId("target").getDomRef();
    this.byId("link").setHref("#" + oRef.id);
}

你可以在这里找到一个工作小提琴：https://jsfiddle.net/93mx0yvt/26/。