用React Native将输入集中在WebView中

Question

您有什么想法在WebView的此输入中创建onfocus事件吗？

            export default class App extends Component {
             render() {
              return (
              <View style={styles.container}>
             <WebView
                 originWhitelist={['*']}
                source={{ html: ' </br></br><form> <input type="text" 
                placeholder="name" onFocus=(*****)/> <input 
                 type="text" placeholder="surname"/> <Button>Submit</Button> 
             </form>' }}  />
            </View>
                    )}}

我尝试了通常的fonefocus，但它不起作用。我想在集中输入

Answer 1

要对WebView的输入进行操作。这是完整的代码：

      let Script = `
      document.getElementById("input").addEventListener("focus", function() {  
       var data = {
      type: "OnFocusEvent",
      message : "OnFocusEvent"
     };
      window.postMessage(JSON.stringify({data}),"*");
        });
      `;
    <WebView
      style={{ flex: 1 }}
      source={{
        html:
          '</br></br></br></br><form > <input id="input" class="input" type="text" 
        placeholder="Product barcode "/></form>'
      }}
      keyboardDisplayRequiresUserAction={false} //ios
      autoFocus={true} //android
      injectedJavaScript={Script1}
      automaticallyAdjustContentInsets={false}
      allowFileAccessFromFileURLs={true}
      scalesPageToFit={false}
      mixedContentMode={"always"}
      javaScriptEnabled={true}
      javaScriptEnabledAndroid={true}
      startInLoadingState={true}
      onMessage={event => {
      alert("You can do here whatever you want")
      }}
      onLoad={() => {}}
    />

Answer 2

该功能有封闭的拉请求。目前，您可以使用React-enhance-webview

我希望这会有所帮助。祝你好运。