[uniapp/wx小程序] 关于cover-view滚动/点击穿透问题的解决方案/cover-view 的坑

情况：如果在原生组件上，搞了一些弹窗、覆盖层、操作栏等等的东西，有层级的情况，就会出现事件穿透的问题

问题：自然会想到官方给出的解决方案：使用cover-view。但有时穿透问题虽然解决了，但会出现各种新的问题，icon失效、text消失、层级过高、超出范围的元素会被隐藏，border异常...等等

---

经过一系列研究，总结出几个有效的方法，记录一下：

一、使用cover-view和cover-image （建议最后再考虑这个方法）

首先，如果是用view等标签写好的组件，发现了问题，那么建议最后再考虑使用cover-view和cover-image，为什么？因为此项改造成本巨大：

1. 需要将所有的view转换成cover-view，
2. 所有的text都要包裹上cover-view，
3. 所有的icon图标都得废弃并改造成cover-image使用图片代替，
4. 单边的border-radius也会失效，这个改起来更麻烦
5. cover-view在应用中的层级最高，并且无法调整
6. 以上5点的改造，通常要伴随着css代码改动，js逻辑改动

如果是一个复杂的组件，以上这几点的改造成本，测试成本，相当高。

二、使用uni-popup 弹出层

推荐，这个很灵活，虽然大多用来做弹窗，但是可以关闭遮罩层，取消点击遮罩层事件。用来代替cover-view，并且这东西没有太多的限制和坑，里面照样用view，用image，用icon等等，如果是已经开发好的组件修改，代码都不需要太多改动。

唯一的问题就是，要解决滚动穿透/点击穿透，一行代码就能搞定

这个官方文档中也有说到，亲测好用，这个会把滚动穿透、点击穿透，同时解决。