1

是否可以使用 react-native-render-html 导航到页内 URL 片段子资源作为实现浏览器行为？这是一个例子。鉴于 html 道具的这个片段：

<h1 id="title">The Title</h1>
<div style="width:50px;height:200px;">
...
</div>
<a href="#title">Scroll to The Title</a>

当用户按下“滚动到标题”锚点时，我想包含 ScrollView 以滚动到“标题”标题。Linking.openURL 不工作你能建议我的方式吗？

4

1 回答 1

0

实现这个特性是非常特定于底层 HTML 结构的，所以没有一个绝对的、通用的答案。这就是为什么这个库不提供这个特性的原因。但是，在我为 V6编写的本教程中有一个很好的分步指南。

我将总结以下重要步骤：

  1. 感谢自定义渲染器，我们可以使用prop将每个目标的坐标映射到id缓存对象（在上面的教程中） 。请注意，这些坐标是相对于 parent 的。ScrolleronLayoutView
  2. 在同一个缓存对象中，我们存储了对底层ScrollView.
  3. 我们在缓存对象中定义了一个scrollToId方法，它调用底层的ScrollViewrefscrollTo方法来滚动到我们之前映射到目标的坐标。
  4. 我们将renderersProps.a.onPressprop 设置为一个回调，它将调用scrollToId缓存对象的方法。

请注意，您需要通过上下文或通过renderersProps（然后您可以使用道具使用useRendererProp）将缓存对象传递给自定义渲染器。

这些步骤是根据上述教程自由改编的，我邀请您深入了解所有实现细节。需要对 React hooks、context 和 refs 有很好的了解。

于 2021-07-08T13:59:41.500 回答