1

私の経験では、react-native-webviewは、iOS のキーボードで思いどおりに動作するのが難しいことがわかりました。キーボードが表示され、その内容がキーボードによって隠されている場合、その高さは自動的に変更されません。

また、KeyboardAvoidingViewでラップされた奇妙な動作もします。私の場合、WebView のコンテンツを調整しすぎているようで、キーボードの高さの約 2 倍です。この同じ動作は、キーボードの開閉イベントを手動でリッスンし、それに応じて WebView の高さを調整したときに発生しました。

  componentDidMount(){
    Keyboard.addListener("keyboardWillShow", this.keyboardDidShow.bind(this));
    Keyboard.addListener("keyboardWillHide", this.keyboardDidHide.bind(this));
  }

  componentWillUnmount(){
    Keyboard.removeListener("keyboardWillShow", this.keyboardDidShow.bind(this));
    Keyboard.removeListener("keyboardWillHide", this.keyboardDidHide.bind(this));
  }

  keyboardDidShow(event){
    this.setState({
      keyboardHeight: event.endCoordinates.height
    });
  }

  keyboardDidHide(event){
    this.setState({
      keyboardHeight: 0
    });
  }

  render(){
    return (
      <WebView
        style={{flex: 1, maxHeight: Dimensions.get("window").height - this.state.keyboardHeight}}
      />
    );
  }

私は解決策を見つけましたが、最適ではありませんが、解決策は少なくありません。私の答えは以下に掲載されています。

4

1 に答える 1

0

この特定の動作に関する議論が見つからず、私にとって有効な解決策が見つからなかったため、react-native-webview ドキ​​ュメントの小道具を調べました。React Nativeのバージョン0.59.9とReact Native WebViewのバージョン5.11.0で最終的に機能したのは、上記のとおりで、キーボードイベントリスナーでWebViewの高さを手動で設定し、 WebView prop を設定しましたuseWebKit={false}。

残念ながら、これは WebView のネイティブ側で現在使用UIWebViewされているが非推奨であり、将来のリリースで削除されることを意味します。

いずれにせよ、これは私が取り組んでいるものであり、誰かが同じ問題を抱えている場合に備えて、私の調査結果を共有したかっただけです.

于 2019-06-18T07:48:33.423 に答える