弹出 fixed 弹窗后,在弹窗上滑动会导致下层的页面一起跟着滚动。

解决方法:

在弹出层加上 catchtouchmove 事件

两种方法:(在电脑上测试是没有用的,这是触摸事件。因此,需要在手机端测试,预览生成一个开发版,用手机微信扫描即可看到效果)

1.

wxml:

<!-- 首页弹窗 -->
<view class='Popup' hidden='{{bool}}' catchtouchmove="test">
js:
  test:function(){

},
2.catchtouchmove="true"就行了,(个人感觉第二种方法比较简单,好用)
<!-- 首页弹窗 -->
<view class='Popup' hidden='{{bool}}' catchtouchmove="true">

微信小程序-自制弹出框禁止页面上下滑动的更多相关文章

  1. (转)微信小程序开发—弹出框

    原文地址 <span style="font-family:Comic Sans MS;font-size:18px;color:#333333;"><view ...

  2. 【小程序】微信小程序开发—弹出框

    1. <span style="font-family:Comic Sans MS;font-size:18px;color:#333333;"><view cl ...

  3. 微信小程序之弹出操作菜单

    <view class="List_count" bindtap="actioncnt"> <view class="img&quo ...

  4. 微信小程序开发:学习笔记[8]——页面跳转及传参

    微信小程序开发:学习笔记[8]——页面跳转及传参 页面跳转 一个小程序拥有多个页面,我们可以通过wx.navigateTo推入一个新的页面.在首页使用2次wx.navigateTo后,页面层级会有三层 ...

  5. 关于微信小程序 modal弹框组件的介绍

    微信小程序 modal: 这里对微信小程序中 modal组件进行详细解析,我想开发微信小程序的小伙伴可以用到,这里小编就记录下modal的知识要点. modal modal类似于javascript中 ...

  6. 【微信小程序】自定义模态框实例

    原文链接:https://mp.weixin.qq.com/s/23wPVFUGY-lsTiQBtUdhXA 1 概述 由于官方API提供的显示模态弹窗,只能简单地显示文字内容,不能对对话框内容进行自 ...

  7. 微信小程序-返回并更新上一页面的数据

    小程序开发过程中经常有这种需求,需要把当前页面数据传递给上一个页面,但是wx.navigateBack()无法传递数据. 一般的办法是把当前页面数据放入本地缓存,上一个页面再从缓存中取出. 除此之外还 ...

  8. 微信小程序入门教程之二:页面样式

    这个系列的上一篇教程,教大家写了一个最简单的 Hello world 微信小程序. 但是,那只是一个裸页面,并不好看.今天接着往下讲,如何为这个页面添加样式,使它看上去更美观,教大家写出实际可以使用的 ...

  9. 直击根源:微信小程序中web-view再次刷新后页面需要退两次

    背景 在上一章(直击根源:vue项目微信小程序页面跳转web-view不刷新)解决了vue在小程序回退不刷新的问题之后,会引出了一个刷新的页面需要点击返回两次才能返回上一个页面 问题描述 在A页面从B ...

随机推荐

  1. IP冲突如何把冲突的IP挤下去

    把冲突IP挤下去的方法: ①进入网络和共享中心>本地连接>禁用. ②进入网络和共享中心>更改适配器设置>双击被禁用的连接,自动重新连接即可.

  2. 阶段3 2.Spring_08.面向切面编程 AOP_4 spring基于XML的AOP-配置步骤

    resources下新建bean.xml文件 xmlns:aop 先配置IOC aop 通知类就是logger.id配置为logAdvice表示日志的通知 梳理流程 首先我们在这有个Service它需 ...

  3. epoll 性能分析(解决占用CPU 过高问题)2

    针对服务器框架Engine,在工作线程中发现该线程占用CPU过高,分析之后发现问题出在死循环那里 void cServerBase::OnProcess() { printf("cServe ...

  4. SSM项目——乐淘商城话述1.0

    乐淘商城 项目介绍 淘淘网上商城是一个综合性的B2C平台,类似京东商城.天猫商城.会员可以在商城浏览商品.下订单,以及参加各种活动.管理员.运营可以在平台后台管理系统中管理商品.订单.会员等.客服可以 ...

  5. 【VS开发】循序渐进学习使用WINPCAP(一)

    winpcap教程 中文教程 http://www.ferrisxu.com/WinPcap/html/index.html 除此之外, WinPcap · Developer Resources下载 ...

  6. 访问DataGridView的Rows报了OutOfIndexRangeException错误

    DataGridView绑定了一个List<Entity>实体集合,在遍历DataGridView的每一行DataBoundItem时候,如果符合某个条件的话,则移除List<Ent ...

  7. flask response 详解

    from flask import Flask,Response,jsonify #Flask = werkzeug(处理网络的) + sqlalchemy(处理数据库的) + jinja2 (处理模 ...

  8. React进阶篇学习

    继续上一次基础篇, 分享一些关于React的进阶技术 React 进阶部分 ** context ** ** setState vs forceUpdate ** ** Mixins ** ** HO ...

  9. 一道最大公约数的题:easy number

    现有n个Zack,每个Zack有一个一个能力值,从这n个Zack中选出k个,使他们的最大公约数的值最大 [输入格式] 第一行有一个整数n,代表有n个Zack 第二行n个整数ai,代表每个Zack的能力 ...

  10. 洛谷 P2331 最大子矩阵 题解

    题面 对于m==1和m==2两种状态进行不同的dp: 设sum[i][1]表示第一列的前缀和,sum[i][2]表示第二列的前缀和: sum[i][1]=sum[i-1][1]+a[i][1]; su ...