时间戳

首页 > 解决方案 > 键盘出现时防止 webview 内容滚动

react-native - 键盘出现时防止 webview 内容滚动

问题描述

    <SafeAreaView style={{ flex: 1 }}>
      <KeyboardAvoidingView
        style={{ flex: 1 }}
        behavior={Platform.OS === "ios" ? "padding" : "height"}
      >
        <WebView
          style={styles.container}
          source={require("./assets/web/index.html")}
          hideKeyboardAccessoryView
          bounces={false}
        />
      </KeyboardAvoidingView>
    </SafeAreaView>

我有一个简单的网站，目前只包含一个用于测试目的的输入元素。我面临的问题是最初在 webview 中没有滚动（如预期的那样）。但是当我关注输入元素（在网页内）时，键盘会上升，然后可以在 webview 内滚动。

似乎网页无法识别窗口的大小调整或类似的东西。该网站首先没有从上到下填充 webview（它只是一个输入元素），所以我认为当键盘出现时它似乎是可滚动的，这很奇怪。我该如何解决这个问题？

我正在使用 expo 和 react-native-webview。

标签： react-nativeexporeact-native-webview

解决方案

推荐阅读