modal 遮罩层，滚动穿透 bug

modal 遮罩层，滚动穿透bug

modal 遮罩层，滚动 穿透bug

float 弹层

taro 小程序弹框 滚动击穿 问题

​

---

solution

disable scroll event

  handleTouchScroll = (flag = `true`) => {
    log(`touch scroll`)
    // if (ENV !== Taro.ENV_TYPE.WEB) {
    //   return
    // }
    document.body.addEventListener(`scroll`, () => {
      log(`no scroll event`)
    });
    let scrollTop = 0;
    if (flag) {
      scrollTop = document.documentElement.scrollTop
      // 使body脱离文档流
      document.body.classList.add('at-frozen')
      // 把脱离文档流的body拉上去！否则页面会回到顶部！
      document.body.style.top = `${-scrollTop}px`
    } else {
      document.body.style.top = null
      document.body.classList.remove('at-frozen')
      document.documentElement.scrollTop = scrollTop
    }
  }

---

modal OK

弹框， 无穿透问题

​​https://taro-ui.jd.com/#/docs/modal​​

​​https://github.com/NervJS/taro-ui/tree/dev/src/components/modal​​

toast

​​https://taro-ui.jd.com/#/docs/toast​​

---

css style

OK

2. height 100%/ 100vh
3. overflow hidden