cocos遮罩层点击穿透问题解决

问题

在场景中添加弹窗等遮罩层，当点击遮罩层时会出现点击穿透问题。

解决

将遮罩层节点放到数组中，方便管理，在start函数中调用preventMask方法，以免cc.find无法查找到遮罩层节点。

onLoad() {
  this.masks = [ 'Canvas/awardMask', 'Canvas/tipsMask', 'Canvas/ruleMask'];
},
start() {
  this.preventMask(); //阻止弹窗mask点击穿透
},
preventMask() {
  this.masks.forEach((item) => {
    cc.find(item).on(cc.Node.EventType.TOUCH_START, (e) => {
      e.stopPropagation();
    })
    cc.find(item).on(cc.Node.EventType.TOUCH_MOVE, (e) => {
      e.stopPropagation();
    })
  })
},

注意

如果发现添加了以上代码，仍不能阻止点击穿透是因为父元素宽高度不足以覆盖，建议检查节点父元素宽高度是否为0，将其调整为屏幕宽高即可。