在实现浏览器行为时，是否可以使用react-native-render-html导航到页面中的URL片段子资源？

Question

在实现浏览器行为时，是否可以使用react-native-render-html导航到页面中的URL片段子资源？下面是一个例子。给定html prop的以下代码片段：

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

当用户按下“滚动到标题”锚点时，我希望包含ScrollView来滚动到“标题”标题。Linking.openURL不工作了，你能给我提个建议吗？

Answer 1

实现此功能非常特定于底层HTML结构，因此没有绝对的、通用的答案。这就是为什么这个库不会提供这个特性。但是，用于V6的there is a good step by step guide in this tutorial I wrote。

我将总结以下重要步骤：

1. 多亏了custom renderers，我们可以通过使用onLayout prop将每个目标的坐标与它们在缓存对象(上面教程中的Scroller)中的id进行映射。注意，这些坐标是相对于同一缓存对象的父级的，我们在缓存对象中存储了对底层ScrollView.
2. We的引用定义了一个scrollToId方法，这将调用底层的ScrollView引用scrollTo method来滚动到我们之前映射到目标的坐标。
3. 我们将renderersProps.a.onPress属性设置为一个回调，该回调将调用缓存对象的scrollToId方法。

请注意，您需要通过a context或renderersProps将缓存对象传递给自定义渲染器(然后可以通过useRendererProp使用该属性)。

这些步骤是从上面的教程中自由改编的，我邀请您深入了解所有的实现细节。良好的反应挂钩，上下文和参考知识是必需的。