码迷,mamicode.com
首页 > 其他好文 > 详细

vue页面禁止蒙层底部滚动

时间:2019-08-23 10:33:11      阅读:250      评论:0      收藏:0      [点我收藏+]

标签:bsp   comm   lse   ram   highlight   底部   pos   mit   cti   

函数名 popupVisible,我是把这个方法放到vuex里面, 滚动高度用变量top表示

state: {
    pageLoad: !0,
    top: 0, // 页面滚动的高度
  }, 
popupVisible(state, newValue) {
      if (newValue) {
        // 页面固定
        state.top = window.scrollY;
        console.log("true--state.top", state.top);
        document.body.style.position = "fixed";
        document.body.style.top = -state.top + "px";
      } else {
        // 页面滚动
        console.log("false--state.top", state.top);
        document.body.style.position = "";
        document.body.style.top = "";
        window.scrollTo(0, state.top);
      }
    },

actions 里面commit 该mutations方法:

hidePass({ commit }, params) { // commit对象
      commit(‘popupVisible‘, params);
    }

vue页面引用:

// 禁止蒙层底部滚动
this.$store.dispatch("hidePass", true);
// 允许
this.$store.dispatch("hidePass", false);
 

vue页面禁止蒙层底部滚动

标签:bsp   comm   lse   ram   highlight   底部   pos   mit   cti   

原文地址:https://www.cnblogs.com/demi-guoba/p/11398403.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!