如何才能在map组件上方为其他组件添加阴影效果而不被map遮盖
本小白最近在练手微信小程序，想仿写一下滴滴的青桔单车小程序的界面，过程中发现了一个细节，难以实现和官方一样的效果，想问问有没有踩过坑类似坑的前辈们能告知如何解决？
具体的坑
map优先层级最高，会遮盖掉box-shadow做出的阴影
青桔单车的首页
在扫码解锁的按钮上方，跟地图的接合的地方，又一道较浅的阴影，来呈现出立体感。
地图顶部也是一样的
对于这个这效果，我做了以下猜测和尝试
- 给扫码解锁这个view添加box-shadow样式,但是发现添加的样式在开发者工具的模拟器上可行，真机上却会被map组件遮盖掉
- map组件自身向内的上下 box-shadow inset
模拟器能够显示
真机会被遮盖
种种测试都失败了，阴影实际是添加成功的，开发者工具正常显示阴影样式，但是在真机上会被map组件遮盖掉，不知道青桔单车官方是如何规避了map的坑，做出这种效果
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
你需要用到这个，自己添加一个图片来实现，你说的那种效果都是这样来实现的，，