问题
当fixed定位元素的DOM层级较深时,z-index会受到层叠上下文的影响,无论z-index设置多大,都无法超过父元素的层级
方案一
将fixed元素放到外层,避免受到层叠上下文的影响
方案二
使用UI组件提供的指定挂载位置配置,修改fixed元素在DOM结构中的位置
例如vant的popup组件
方案三
如果是自定义组件,以vue为例,可以在组件加载时修改组件的挂载位置
mounted() {
const _dom = document.querySelector('body');
// 将当前组件挂载到body下的最后
_dom.insertBefore(this.$el, _dom.lastChild);
}