加 fixed
弹出层show的时候给body加fixed
弹出层hide的时候把body的fixed去掉
加指令
{
directives: {
fixed: {
inserted () { //被绑定元素插入父节点时调用
let scrollTop = document.body.scrollTop || document.documentElement.scrollTop
document.body.style.cssText += 'position: fixed; width: 100%; top: -' + scrollTop + 'px;'
},
unbind () { //指令与元素解绑时调用
let body = document.body
let top = body.style.top
body.style.top = ''
body.style.position = ''
document.body.scrollTop = document.documentElement.scrollTop = -parseInt(top)
}
}
}
}
- 使用方法
<div v-if="isShow" v-fixed>
....
</div>
须使用v-if来隐藏和展示弹窗,因为依赖于dom的插入和注销,使用v-show不行
网友评论