检测按钮单击Review Native

Question

我正在开发一个React Native应用程序。这是一个非常简单的应用程序。我只需要在webview上加载一个网站，这是完美的。但我的客户想要一些我不知道该怎么办的东西。

网站上有一些社交媒体按钮。喜欢facebook，twitter等所以我的客户希望我在用户点击它们时打开社交媒体应用。假设用户点击了Facebook按钮，那么Facebook应用程序将加载。

我非常需要知道解决方案。请帮我。提前谢谢。

Answer 1

利用onMessage。

代码未经测试，但您应该了解它正在努力实现的目标。

网页：

function facebookClick() {
    window.postMessage("Facebook button done got clicked");
}

var _fb_button = document.getElementById("your-facebook-button");
_fb_button.addEventListener("click", facebookClick, false);

web视图：

[...]
import { Linking } from 'react-native';
[...]
    <WebView
         onMessage={(event) => {
                        let message = event.nativeEvent.data;
                        if(message.includes("Facebook button done got clicked")) 
                            Linking.openURL('fb://page/PAGE_ID');
                    }}
[...]

您必须查看您尝试通过deeplink打开的每个社交应用的当前协议详细信息。完成后，您可以使用Linking.canOpenURL

进一步改进代码