Отключить масштабирование в web-view react-native?

Как отключить zoom on react-native web-view, есть ли такое свойство, как hasZoom={false}(просто пример) , который может быть включен в ниже web-view тег, который может отключить масштабирование. Она работает на Android и iOS.

<WebView
     ref={WEBVIEW_REF}
     source={{uri:Environment.LOGIN_URL}}
     ignoreSslError={true}
     onNavigationStateChange={this._onNavigationStateChange.bind(this)}
     onLoad={this.onLoad.bind(this)}
     onError={this.onError.bind(this)}
 ></WebView>
10
android hybrid-mobile-app ios react-native webview

6 ответов

думал, что это может помочь другим, я решил это, добавив следующее в заголовок:

<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0">

13

попробовать scalesPageToFit={false} подробнее в здесь

4

обновление:

для тех, кто хочет получить четкое представление 

const 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); `

 <WebView
  source={{ html: params.content.rendered }}
  scalesPageToFit={isAndroid() ? false : true}
  injectedJavaScript=INJECTEDJAVASCRIPT
  scrollEnabled
 />
2

для всех в будущем я решил это, добавив следующий css:

*:not(input) {
  user-select: none;
}

выше в основном отключить выделение текста на всех элементах, которые во время моего тестирования запретили масштабирование на веб-странице. FYI: я не углублялся в детали, просто констатируя его последствия.

0

я смог отключить масштабирование, выбор текста и другие события указателя, обернув WebView на View и установка нескольких реквизита:

<View pointerEvents="none">
  <WebView
    source={{ uri: webviewUrl }}
    scrollEnabled={false}
  />
</View>
0

поместите этот атрибут в Webview pointerEvents="none" или оберните Webview другим представлением с этим атрибутом.

-1