弹出 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. IK分词器的安装与使用IK分词器创建索引

    之前我们创建索引,查询数据,都是使用的默认的分词器,分词效果不太理想,会把text的字段分成一个一个汉字,然后搜索的时候也会把搜索的句子进行分词,所以这里就需要更加智能的分词器IK分词器了. 1. i ...

  2. javase程序设计上机作业2

    package javaxgp.teacher.test; import java.util.Scanner; public class Demo3 { public static void main ...

  3. centos8飞行驾驶舱和docker安装

    零.先解决cenos8的网络(systemctl restart network.service已被废弃) 1.# vim /etc/sysconfig/network-scripts/ifcfg-e ...

  4. HDU 1297 Children’s Queue （递推、大数相加）

    Children’s Queue Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) ...

  5. sqlserver迁移mysql语法修改

    1.top 100  选取表中前100条改为 limit #{limit},limit 为变量2.获取当前日期getdate()改为now()3.id=#{id,jdbcType=BIGINT}改为i ...

  6. Java 使用JDBC连接查询操作数据

    import org.apache.logging.log4j.LogManager; import org.apache.logging.log4j.Logger; import java.sql. ...

  7. CF 631B 题解

    题面 注意到每次只染色一行或者一列,那么我们最后输出第i行第j列的数字是多少的时候只需要看一下最后一次i行和第j行被染了什么颜色,所以我们需要对每一行和一列记录最后一次染色的颜色. 但是我们也需要比较 ...

  8. 剑指offer 数字翻译成字符串

    0 -> 'a', 1->'b', ..., 11 -> 'l', ..., 25->'z'. 计算一个数有多少种不同的翻译方法. 分析:记f[i]表示从第i位起的不同翻译数目 ...

  9. 097、如何实现Service伸缩？（Swarm04）

    参考https://www.cnblogs.com/CloudMan6/p/7885667.html   上一节部署了只有一个副本的Service,不过对于web服务,我们通常会运行多个实例,这样可以 ...

  10. ubuntu安装selenium谷歌插件

    爬虫之selenium 安装与 chromedriver安装 今天学到一个有意思的插件,就是chromedriver,在爬虫的时候,如果网站反爬虫做的很好,自己又很想爬去里面的数据,那就可以用这个插件 ...