最近开发过程中遇到一些小问题(似乎问题总是那么多),但一直没什么时间去优化与解决。程序员不能被业务绑架,有时间还是花点在代码,开始这次的vue尝试吧。
首先定义一个全局样式:
.noscroll{ position: fixed; left: 0; top: 0; width: 100%; }
创建一个dom.js文件,定义几个方法:
export function hasclass(el, classname) { let reg = new regexp('(^|\\s)' + classname + '(\\s|$)') return reg.test(el.classname) } export function addclass(el, classname) { if (hasclass(el, classname)) { return } if(el.classname === ''){ el.classname += classname }else{ let newclass = el.classname.split(' ') newclass.push(classname) el.classname = newclass.join(' ') } } export function removeclass(el,classname) { if (hasclass(el, classname)) { el.classname = el.classname.replace(new regexp('(\\s|^)' + classname + '(\\s|$)'), ''); }; }
获取<html>标签的dom:
this.htmldom = document.getelementsbytagname('html')[0];
在弹框弹出来的时候:
addclass(this.htmldom, 'noscroll');
弹框关闭的时候
removeclass(this.htmldom, 'noscroll');
这样就可以解决滚动穿透的问题了~
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持移动技术网。
如对本文有疑问, 点击进行留言回复!!
vue 动态设置img的src地址无效,npm run build 后找不到文件的解决
解决vue动态路由异步加载import组件,加载不到module的问题
解决vue的router组件component在import时不能使用变量问题
Vue中的this.$options.data()和this.$data用法说明
GBase 8a MPP Cluster使用Ceph做存储计算分离
网友评论