Disable pick / touch menu in iOS

I have a new React Native question. I am trying to use WebView in a React View class, but I cannot get rid of the selection menu. I do not know if the “selection menu” is correct, but it appears when I press and hold the mouse / finger.

I tried browsing directly on the HTML page on the iPhone, and the “menu” does not appear there.

React Native class:

var React = require('react-native');

var {
  WebView
} = React;

var TestWebView = React.createClass({
  render: function() {
    return (
      <WebView url="http://url/index.html" />
    );
  }
});

module.exports = TestWebView;

HTML:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <style type="text/css">
      body {
        background: pink;
      }

      body {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        outline: none;
        -webkit-tap-highlight-color: transparent; /* mobile webkit */
      }
    </style>
  </head>
  <body>
  </body>
</html>

Result:

Result

If I delete the second block of styles, I get the following result:

Another result

So, it seems that the style has some effect, but it does not completely remove it.

Any ideas?

I am using React Native 0.11.4.

+4
source share

Source: https://habr.com/ru/post/1610152/


All Articles