uniapp禁止微信浏览器长按出菜单-适用IOS（亲测可用）

uniapp禁止微信浏览器长按出菜单-适用IOS（亲测可用）
vue 禁用长按图片弹出菜单
vant/vue手机端长按事件以及禁止长按弹出菜单_vue 移动端按住两秒出现弹框
禁止ios长按时触发系统的菜单,禁止ios&android长按时下载图片_禁用安卓,ios长按弹出菜单

一、问题描述

如图：

有网友提到：目前官方未提供禁用API，可尝试使用空白浮层阻断长按事件。

二、正常处理：

iso安卓 亲测可用

img{
    //元素不能成为鼠标事件的target
    pointer-events:none;
    -webkit-pointer-events:none;
    -ms-pointer-events:none;
    -moz-pointer-events:none;
}

下面是网上常见的两种css方法，但都不行

img{
    //不能被选择
    user-select:none;
    -webkit-user-select:none;
    -ms-user-select:none;
    -moz-user-select:none;

    //禁用系统默认菜单
    touch-callout:none;
    -webkit-touch-callout:none;
    -ms-touch-callout:none;
    -moz-touch-callout:none;
}   

三、uniapp增强处理：

由于uniapp提供了uni-image控件，故可以除了对上述方案处理以外，还可以对uniapp做以下处理：

uni-image>img, img {
	pointer-events: none;
	-webkit-pointer-events: none;
	-ms-pointer-events: none;
	-moz-pointer-events: none;
}

uni-image::before {
	content: ' ';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: transparent;
	opacity: 0;
}

这样对控件uni-image的事件不影响，又对img覆盖了一层蒙版，也就不会出现长按菜单了。

---

[The end]