vue頁面有彈層,禁止頁面滾動
vue頁面有彈層,禁止頁面滾動
data() {
return {
popupVisible: false
},
watch: { // 監聽data中彈層狀態
popupVisible(val) {
if (val) {
document.body.style.overflow = 'hidden'
document.addEventListener('touchmove', function (e) {
e.preventDefault()
}, {
passive: false
}) // 禁止頁面滑動
} else {
document.body.style.overflow = '' // 出現滾動條
document.removeEventListener('touchmove', function (e) {
e.preventDefault()
}, {
passive: false
})
}
}
},
相關文章
- 遮罩層禁止頁面滾動遮罩
- 禁止蒙層底部頁面跟隨滾動
- 禁止頁面滾動的方法
- app直播原始碼,彈出層 加遮罩層 頁面禁止滑動APP原始碼遮罩
- 禁止頁面Body在後臺滾動
- 直播平臺製作,禁止頁面滾動 / 滾動事件穿透事件穿透
- vue 監聽頁面滾動事件Vue事件
- H5頁面遮罩彈框下層還能滾動的問題H5遮罩
- h5單頁面彈出彈窗背景滾動問題H5
- 頁面圖片自動滾動
- 頁面滾動偵聽器
- Flutter SingleChildScrollView 滾動頁面FlutterView
- 前端頁面自定義滾動條前端
- js頁面全屏垂直滾動效果JS
- 移動端頁面滾動--解決方法
- js/jquery禁止頁面回退JSjQuery
- 關於頁面無限滾動思路
- 直播平臺原始碼,vue+vue-fullpage實現整屏滾動頁面原始碼Vue
- js頁面彈窗JS
- vue監聽頁面中的某個div的滾動事件,並判斷滾動的位置Vue事件
- 移動端觸屏拖動頁面滾動效果
- jQuery 頁面滾動 吸頂 和 吸底jQuery
- 禁止網頁出現滾動條 scroll iframe overflow-x網頁
- angular 監聽 Windows 滾動事件 實現頁面滾動載入AngularWindows事件
- VUE 單頁面應用 修改頁面titleVue
- Vue實現浮動按鈕元件 - 頁面滾動時自動隱藏 - 可拖拽Vue元件
- 滑鼠雙擊頁面實現自動滾動效果
- js頁面跳轉的問題(跳轉到父頁面、最外層頁面、本頁面)JS
- H5頁面滾動阻尼效果實現H5
- Flutter 頁面滾動吸頂詳解(NestedScrollView)FlutterView
- 頁面全屏垂直平滑滾動程式碼例項
- 禁止使用框架引用網站頁面框架網站
- 直播軟體搭建,vue3 頁面回到頂部(平緩滾動效果)Vue
- Vue.js輕鬆實現頁面後退時,還原滾動位置Vue.js
- 訊息提示彈層滾動JQUERRY
- vue頁面跳轉Vue
- 頁面彈窗處理方案
- 10行程式碼實現頁面無限滾動行程