React Native WebView html <select>无法在Android平板电脑上打开选项

Question

我在使用HTML＆lt; select＆gt;的React Native的WebView中遇到了一个非常奇怪的问题。 Android平板电脑上的标签。出于某种原因，点击渲染的＆lt; select＆gt;按钮不会打开选项列表。 这只发生在Android平板电脑上，无论Android版本如何。但是，在Android智能手机上，不会发生此错误，并且选项列表会按预期打开。 为了重现这个bug，我创建了一个简单的演示应用程序：https：//github.com/huonderv/react-native-webview-html-select-bug。 重要的代码如下： index.android.js 导入React，{Component}来自＆＃39;反应＆＃39 ;; import {   AppRegistry，   样式表   文本，   视图，   的WebView 来自＆＃39; react-native＆＃39 ;; 导出默认类WebViewProject扩展Component {   render（）{     回来（       ＆lt; WebView style = {styles.container}                source = {{uri：＆＃39; file：///android_asset/simpleselect.html'}}                startInLoadingState = {true} /＆gt;     ）;   } } const styles = StyleSheet.create（{   容器： {     flex：1，   }， }）; AppRegistry.registerComponent（＆＃39; WebViewProject＆＃39;，（）=＆gt; WebViewProject）; simpleselect.html ＆lt;！DOCTYPE html＆gt; ＆LT; HTML＆GT; ＆LT;身体GT; ＆LT;选择＆GT;     ＆lt; option value =＆＃34; volvo＆＃34;＆gt; Volvo＆lt; / option＆gt;     ＆lt; option value =＆＃34; saab＆＃34;＆gt; Saab＆lt; / option＆gt;     ＆lt; option value =＆＃34; opel＆＃34;＆gt; Opel＆lt; / option＆gt;     ＆lt; option value =＆＃34; audi＆＃34;＆gt; Audi＆lt; / option＆gt; ＆LT; /选择＆GT; ＆LT; /体＆GT; ＆LT; / HTML＆GT; 我还尝试用Crosswalk替换WebView，如下所述：https：//github.com/grovertb/react-native-crosswalk-webview。但是，这并没有解决这个问题。 有谁知道如何在Android平板电脑上使用React Native WebView？

Answer 1

我只是沿着封闭issue的线索，在我看来，有两种解决方案可能对您有用。

首先来自comment的Anthony Dunk：

  

将class“ needsclick”添加到选择中，从而在Android上为我解决了此问题。

我发现的第二个是来自this的rbravo

  

我通过检测何时在Webview内的页面上单击任何选择元素（通过注入一些js并使用postMessage），然后在1ms的超时时间内将webview的大小调整为1px（并再次返回原始大小），将其固定在项目上。这触发了render方法，并且本机选择菜单位于Web视图的顶部（因为整个问题是本机菜单在Web视图后面打开并没有显示）。   它对我有用！

但是，有人再次声称，任何共享的解决方案都不适用于他们。

该问题已传递给MIGRATED: html select element not working in WebView on android tablets (#12070) #6，并且在没有适当解决方案的情况下仍被关闭。引用了The android is Flash back when i use webview in scrollview #477，它也因为处于停用状态超过2个月而被关闭。

目前可能没有合适的解决方案，但请告知我们是否有任何解决方案。

Answer 2

此link解决方案为我工作。为了解决此问题，请制作一个FixWebView.js组件并将其包含在您的Webview组件中。

示例： FixWebView.js

WebViewScene.js渲染方法