如何使用 Framework7-React 在 JS 代码中捕获返回按钮事件？答案

【问题标题】：How to capture Back button event in JS code using Framework7-React?如何使用 Framework7-React 在 JS 代码中捕获返回按钮事件？
【发布时间】：2019-05-07 01:13:59
【问题描述】：

我只需要在我的代码中为特定页面捕获返回按钮事件。由于我使用的是 Framework7 NavBar react 组件，因此我找不到可以覆盖/捕获后退事件的地方。

我指的是用于 IOS 应用程序开发的 framework7-react，并且我已将“返回”链接放在文档中。 Framework7 4.3.1版

他们正在为导航栏提供“backLink”属性，但我如何在我的 JS 代码中捕获事件？

这是用于导航栏的 Framework7 React 文档的链接。 https://framework7.io/react/navbar.html

【问题讨论】：

这是我正在使用的导航条码
其他页面需要使用backLink按钮吗？我理解你的问题对吗？
不是真的，当用户单击返回按钮时，我需要在我的 JavaScript 代码中执行其他操作。由于导航栏实现为，因此没有元素/css 类我可以捕获返回链接上的点击事件
在这种情况下，您可以创建自定义按钮。在 Framework 7 - React 您可以找到 NavLeft 组件或在 Navbar 中您可以创建 Button 或任何其他元素并给它们<a href="#" slot="nav-left">Left Link</a> - 像这样：framework7.io/react/navbar.html#navbar-slots 正确地看这里。祝你好运:)
@Robert 非常感谢您的指导！我能够使其与导航栏插槽一起使用。我详细发布了答案，以防对其他人有所帮助

标签： reactjs html-framework-7

【解决方案1】：

在@Robert Hovhannisyan 的指导下，我已经成功了。我所做的是扩展 Navbar 实现添加 NavBar Slots。

<Navbar title="Home">
  <a href="#" className="home-back" slot="nav-left">Back</a>
  <a href="#" slot="nav-right">Next</a>
  <div>Home</div>
</Navbar>

之后，我能够使用 css 类“home-back”在“Back”链接上捕捉 onClick 事件

希望这对某人有所帮助。

【讨论】：