項目場景:
提示:這里簡述項目相關背景:
一般在我們做大屏的時候,不希望Ctrl+鼠標上下滾動的時候頁面會放大/縮小,那么在有時候,又不希望影響到別的頁面,比如說這個大屏是在另一個管理后臺中,那么,在管理后臺Ctrl+鼠標上下滾動是可以縮放的,但是,跳轉到大屏時候是不希望縮放的。
這時候我們可以將阻止縮放函數放在大屏的頁面中
問題描述
提示:這里描述項目中遇到的問題:
解決方案:
提示:這里填寫該問題的具體解決方案:
onMounted(() => {getData();// 初始化的時候請求數據preMouse();//初始化的時候阻止縮放
});
onBeforeUnmount(()=>{window.removeEventListener('wheel', preMouse)
})// 阻止 ctrl+鼠標上下滾動 頁面元素改變大小 -阻止縮放
const preMouse=()=>{window.addEventListener('wheel', (event:any) => {if ((event.wheelDelta && event.ctrlKey) || event.detail) {event.preventDefault();}if (event.ctrlKey) {// ctrl + 鼠標滾輪 的行為} else if (event.shiftKey) {// shift + 鼠標滾輪 的行為} }, { capture: false, passive: false });
}