OStack程序员社区-中国程序员成长平台

标题: ios - 在 React Native 中禁用放大 WebView 或 react-native-wkwebview [打印本页]
作者: 菜鸟教程小白    时间: 2022-12-13 04:02
标题: ios - 在 React Native 中禁用放大 WebView 或 react-native-wkwebview

有没有办法在 iOS 的 WKWebView 和 android 的 WebView 中禁用缩放？我正在使用 react-native-wkwebview-reborn。


Best Answer-推荐答案


在 webview 中呈现的文档的头部粘贴在这个 meta 中:

<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />

例子:

<!doctype html>

<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
    </head>
    <body>

    </body>
</html>

您可以将其注入(inject)到您的 webview 中。

const SCRIPT = `
const meta = document.createElement('meta');
meta.setAttribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');
meta.setAttribute('name', 'viewport');
document.head.appendChild(meta);
`;

<WebView injectedJavaScript={SCRIPT} />

关于ios - 在 React Native 中禁用放大 WebView 或 react-native-wkwebview，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49121466/





欢迎光临 OStack程序员社区-中国程序员成长平台 (https://ostack.cn/) Powered by Discuz! X3.4