我在 react-native 中使用“WebView”来呈现网页。该网页没有适合移动设备的用户界面。
当我在 Chrome 浏览器中打开它时,它如下所示。 我想像下面那样渲染它
但是当我渲染下面的代码时,它看起来像下面显示的图像。
请看我尝试了不同的 Prop automaticallyAdjustContentInsets = {false}
, scalesPageToFit={false}
。但它并没有给我想要的输出。
render(){
const URL = "https://stellarterm.com";
return(
<WebView
source={{URL}}
/>
结果
如果您有任何解决方案,请随时提出建议。任何第三方库也可以。
最佳答案
您的网站已经在元数据中设置了页面宽度 <meta name="viewport" content="width=1080">
所以你需要用 injectedJavaScript 覆盖它
injectedJavaScript={`const meta = document.createElement('meta'); meta.setAttribute('content', 'width=device-width, initial-scale=0.5, maximum-scale=0.5, user-scalable=0'); meta.setAttribute('name', 'viewport'); document.getElementsByTagName('head')[0].appendChild(meta); `}
scalesPageToFit={false}
关于android - 如何在 react native 中缩小 WebView?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50110920/