无论是在小程序还是APP中,打开一个页面其实就是创建了一个新的View对象,一层层叠加的。当点击页面的回退按钮就是把当前页面关闭。

这个过程中会涉及到一个问题,就是打开页面的数量。在某些设计下,比如一个商品详情页面中会推荐其他的商品,这些商品点进去就是详情页面。详情页面中又有推荐,又可以点进去。这样重复下去打开的页面就会越来越多。

如果不做限制,当打开数量到一定程度的时候肯定会卡死了。在微信小程序中打开的页面不能超过10个,达到10个页面后,就不能再打开新的页面。

之前出现这个问题,还以为是Bug,是不是卡死了,后来发现只要回退一个页面又可以重新打开了。才发现了最大10个页面的限制。

特意调研了其他公司的小程序,发现确实有这个问题。我这边就做了一个提示告诉用户不能打开这么多页面,不然用户会一脸茫然,点着点着就点不了。

每个页面都会需要跟后台交互加载数据,我这边在统一的Http请求中进行判断。

  1. var pages = getCurrentPages();
  2. console.log("pages:" + pages.length);
  3. if (pages.length == 10) {
  4. wx.showToast({
  5. title: "页面打开太多,请回退关闭几个页面",
  6. icon: 'none',
  7. duration: 2000
  8. })
  9. setTimeout(() => {
  10. wx.navigateBack({
  11. })
  12. }, 2000)
  13. return;
  14. }

当打开第10个页面的时候,给出提示,然后跳回上一个页面。

欢迎加入我的知识星球,一起交流技术,免费学习猿天地的课程(http://cxytiandi.com/course)

微信小程序之页面打开数量限制的更多相关文章

  1. 微信小程序:页面配置 page.json

    微信小程序:页面配置 page.json 一.页面配置 page.json 如果整个小程序的风格是蓝色调,那么可以在 app.json 里边声明顶部颜色是蓝色即可. 实际情况可能不是这样,可能你小程序 ...

  2. 微信小程序开发--页面结构

    一.微信小程序开发--页面文件组成 [page.name].js 页面逻辑文件,用于创建页面对象,以及处理页面生命周期控制和数据处理 [page.name].wxml wxml指的是Wei Xin M ...

  3. 微信小程序前端页面书写

    微信小程序前端页面书写 WXML(WeiXin Markup Language)是框架设计的一套标签语言,结合基础组件.事件系统,可以构建出页面的结构. 一.数据绑定 1. 普通写法 <view ...

  4. 图解微信小程序---实现页面的跳转与返回操作

    图解微信小程序---实现页面的跳转与返回操作 代码笔记 操作步骤 第一步:在app.json配置文件中,创建跳转页面 第二步:编写首页跳转(注意跳转方式,和设置点击样式类名) 第三步:编写首页样式 第 ...

  5. 微信小程序之页面路由

    路由方式 简介 对于路由的触发方式以及页面生命周期函数如下: 路由方式 触发时机 路由前页面 路由后页面 初始化 小程序打开的第一个页面   onLoad, onSHow 打开新页面 调用 API w ...

  6. 微信小程序之 页面跳转 及 调用本地json的假数据调试

    一.微信小程序 跳转页面 小程序页面有2种跳转,可以在wxml页面或者js中: (1)在wxml页面中: <navigator url="../index/index"> ...

  7. 微信小程序的页面渲染(if/for)

    下面,粗略的介绍一下微信小程序的条件渲染.列表渲染.数据绑定等,详细的内容大家可以去看微信小程序的API,在此只做简单描述,希望能帮助到大家 条件渲染 <!--wxml--> <vi ...

  8. 微信小程序之页面传值(路由、页面栈、globalData、缓存)

    1. 通过url带参数传递 1.1 固定参数传递 例如,从 list 页面到 detail 页面, 传递一个或多个固定值 list页面传值: <!--pages/list/list.js--&g ...

  9. 开发 | 如何在微信小程序的页面间传递数据?

    我们在之前发布过小程序页面传值方法的简单介绍,说明了在小程序开发中,两种常见的页面之间传值方法. 本期,知晓程序(微信号 zxcx0101)为你带来的是「倒数记日」小程序开发者带来的,小程序开发中,有 ...

随机推荐

  1. HTML+CSS基础 权重的计算 权重计算规则

    权重的计算 将选择器上面的选择器进行叠加,叠加后的总和就是该选择器的权重. 权重计算规则

  2. FocusVisualStyle

    <Style x:Key="MyFocusVisual">      <Setter Property="Control.Template"& ...

  3. C#写日志工具类

    代码: using System; using System.Collections.Generic; using System.IO; using System.Linq; using System ...

  4. word转txt

    import org.apache.poi.hwpf.extractor.WordExtractor; import java.io.IOException; import java.io.Input ...

  5. git使用读书笔记

    Normal 0 7.8 磅 0 2 false false false EN-US ZH-CN X-NONE /* Style Definitions */ table.MsoNormalTable ...

  6. spark2.4.2 源码编译

    基于Maven的构建是Apache Spark的参考构建.使用Maven构建Spark需要Maven 3.5.4和Java 8.请注意,从Spark 2.2.0开始,对Java 7的支持已被删除. 包 ...

  7. tornado 之 RequestHandler(请求)

    RequestHandler from tornado.web import ReuqestHandler 一.利用HTTP协议想服务器传递参数 提取url的特定部分 http://127.0.0.1 ...

  8. 7、Topic

    Topics In the previous tutorial we improved our logging system. Instead of using a fanout exchange o ...

  9. AVX 指令详解 ,还有SSE指令

    https://blog.csdn.net/fengbingchun/article/details/23598709 本人从来不复制的,自己看!.

  10. 学习9:MongoDB知识

    MongoDB学习笔记 1 基本介绍 基本概念 MongoDB**是一种面向文档的数据库管理系统,由C++语言编写的,是一个基于分布式文件存储的开源数据库系统.2007年10月,MongoDB由10g ...