vue,uniapp--js禁止页面滚动,取消滚动方式
更新时间：2024年05月24日 10:03:15 作者：沐卿゚
这篇文章主要介绍了vue,uniapp--js禁止页面滚动,取消滚动方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
vue,uniapp js禁止页面滚动,取消滚动
首先是禁止页面滚动
//禁止页面滑动
stop(){
var box=function(e)
{passive: false ;};
document.body.style.overflow='hidden';
document.addEventListener("touchmove",box,false);
},取消禁止滚动
//允许页面滑动
move(){
var box=function(e){passive: false };
document.body.style.overflow='';//出现滚动条
document.removeEventListener("touchmove",box,false);
},什么都不用改，把方法复制过去在你需要得节点触发方法就行。
非常的简单~~~
uniapp自定义弹窗弹出后禁止页面滚动
弹窗弹出后
禁止页面内容滚动
可以使用在蒙层上使用
@touchmove.stop.prevent="moveHandle"
在PC端浏览器移动设备模式调试时
鼠标滑轮依然可以滚动
鼠标拖拽上划就无法滚动
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了详解vue 组件的相关知识，文中讲解非常细致，代码供大家参考学习，感兴趣的朋友可以了解下2020-06-06
当在做后台管理系统的时候，会用到用户的状态管理这个功能，本文主要介绍了element多选表格中使用Switch开关的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-07-07
这篇文章主要给大家介绍了关于vue3父组件调用子组件的方法例子,文中通过实例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2023-07-07
vue项目打包上线后,首次打开会发现加载很慢,出现白屏的问题,下面这篇文章主要给大家介绍了关于Vue首屏加载过慢出现白屏的6种优化方案,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2023-02-02
这篇文章主要为大家详细介绍了vue-router原理并实现一个小demo，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下，希望能够给你带来帮助2022-03-03
这篇文章主要介绍了vue判断内容是否滑动到底部的三种方式,文中通过代码示例给大家介绍的非常详细,对大家的学习或工作有一定的帮助,需要的朋友可以参考下2024-04-04
这篇文章主要介绍了详解Vue打包优化之code spliting，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-04-04
vue单向以及双向数据绑定方式(v-bind和v-model的使用)
这篇文章主要介绍了vue单向以及双向数据绑定方式(v-bind和v-model的使用)，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-04-04
vue的.vue文件是怎么run起来的(vue-loader)
通过vue-loader，解析.vue文件，在webpack解析，拆解vue组件 ，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友参考下2018-12-12
vue el-date-picker 日期回显后无法改变问题解决
这篇文章主要介绍了vue el-date-picker 日期回显后无法改变问题解决,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2023-04-04
最新评论