微信小程序页面跳转、逻辑层模块化

一、页面的跳转

  微信小程序的页面跳转函数方法有两个,另外还有两种模块跳转方式。

  函数跳转:

  1.wx.navigateTo(OBJECT):

wx.navigateTo({url: 'test?id=1'})
//
保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面。
//问号后面的参数为传递至指定页面onload方法内的参数。id为自定义参数名,在跳转页面获取参数值时,也是通过这个设置的参数来获取的。

  2.wx.redirectTo(OBJECT):

       wx.redirectTo({url: 'test?id=1'})
//销毁
当前页面,跳转到应用内的某个页面。
//问号后面的参数为传递至指定页面onload方法内的参数。id为自定义参数名,在跳转页面获取参数值时,也是通过这个设置的参数来获取的。

  模块跳转:

  1.标签跳转:

   在wxml中添加一个navigator元素,实现跳转。

<navigator url='../list/list'>点击我</navigator>

  2.tabBar跳转:

  在主页中设置tabBar,在tabBar中设置跳转页面。通过点击其中的图标,实现跳转。

{"tabBar": {"list": [{"pagePath": "index","text": "首页"},{"pagePath": "other","text": "其他"}]}}

  通过wx.switchTab(OBJECT)方法,可以从非tabBar跳转至tabBar页面,并关闭所有其他非tabBar页面。

wx.switchTab({url: '/index'})

  

  页面的返回:

             关闭当前页面,返回上一页面或多级页面。可通过getCurrentPages()获取当前的页面栈,决定需要返回几层。 

OBJECT 参数说明:

 

参数类型默认值说明
deltaNumber1返回的页面数,如果 delta 大于现有页面数,则返回到首页。

 

// 注意:调用 navigateTo 跳转时,调用该方法的页面会被加入堆栈,而 redirectTo 方法则不会。见下方示例代码// 此处是A页面
          wx.navigateTo({url: 'B?id=1'})// 此处是B页面
          wx.navigateTo({url: 'C?id=1'})// 在C页面内 navigateBack,将返回A页面
             wx.navigateBack({delta: 2})

二、逻辑层的模块化:

  调用全局函数getApp()可以获取小程序的全局应用实例,如果需要全局有效的数据我们可以再App()中定义。

//app.js
App({myNumber:1,
})
//logs.js
onLoad: function () {
var app = getApp()
app.myNumber++
}
//list.js
onLoad: function (options) {console.log("我的数据是:",getApp().myNumber);},

  为了提高代码的可读性和效率,可以通过小程序的模块化特性,将公用的或者需要重复复用的代码从程序里抽取出来,打包成单独的.js文件(微信小程序在创建之初就有一个utils/utils.js文件作为js模块,里面暴露了一个获取当前时间的方法),提供某种特定的功能,这就是程序的模块。如果你想要在外部使用utils.js中封装的方法,只能通过module.exports和exports方法对外暴露接口。

module.exports = {formatTime: formatTime,'对外方法名':'本地方法名'
}

  如何在需要使用这些模块的文件中使用:使用 require(path) 将公共代码引入(require 暂时不支持绝对路径)。

//util.js
function sayHello(name) {console.log(`Hello ${name} !`)
}
module.exports = {sayHello: sayHello
}
var util= require('../../utils/util.js')
Page({data:[],onLoad: function() {console.log(util.sayHello('Cc'))},
})

 

 

  

  

 

转载于:https://www.cnblogs.com/moxuexiaotong/p/10241909.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/387619.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

java内存溢出分析工具:jmap使用实战

java内存溢出分析工具&#xff1a;jmap使用实战 在一次解决系统tomcat老是内存撑到头&#xff0c;然后崩溃的问题时&#xff0c;使用到了jmap。 1 使用命令 在环境是linuxjdk1.5以上&#xff0c;这个工具是自带的&#xff0c;路径在JDK_HOME/bin/下 jmap -histo pid>a.log…

Oracle加密解密

Oracle内部有专门的加密包&#xff0c;可以很方便的对内部数据进行加密&#xff08;encrypt&#xff09;和解密&#xff08;decrypt&#xff09;. 介绍加密包之前&#xff0c;先简单说一下Oracle基本数据类型——RAW类型。 RAW&#xff0c;用于保存位串的数据类型&#xff0c;类…

条件变量 sync.Cond

sync.Cond 条件变量是基于互斥锁的&#xff0c;它必须有互斥锁的支撑才能发挥作用。 sync.Cond 条件变量用来协调想要访问共享资源的那些线程&#xff0c;当共享资源的状态发生变化的时候&#xff0c;它可以用来通知被互斥锁阻塞的线程条件变量的初始化离不开互斥锁&#xff0c…

JDK内置工具使用

JDK内置工具使用 一、javah命令(C Header and Stub File Generator) 二、jps命令(Java Virtual Machine Process Status Tool) 三、jstack命令(Java Stack Trace) 四、jstat命令(Java Virtual Machine Statistics Monitoring Tool) 五、jmap命令(Java Memory Map) 六、jinfo命令…

mall整合RabbitMQ实现延迟消息

摘要 本文主要讲解mall整合RabbitMQ实现延迟消息的过程&#xff0c;以发送延迟消息取消超时订单为例。RabbitMQ是一个被广泛使用的开源消息队列。它是轻量级且易于部署的&#xff0c;它能支持多种消息协议。RabbitMQ可以部署在分布式和联合配置中&#xff0c;以满足高规模、高可…

竞价打板的关键点

竞价打板&#xff0c;主要是速度&#xff0c;其他不重要的&#xff0c;如果为了当天盈利大&#xff0c;失去竞价打板的本质含义&#xff0c;因为竞价可以买到&#xff0c;盘中买不到&#xff0c;才是竞价打板的目的&#xff0c;也就是从竞价打板的角度看&#xff0c;主要是看习…

Java常见的几种内存溢出及解决方法

Java常见的几种内存溢出及解决方法【情况一】&#xff1a;java.lang.OutOfMemoryError:Javaheapspace&#xff1a;这种是java堆内存不够&#xff0c;一个原因是真不够&#xff08;如递归的层数太多等&#xff09;&#xff0c;另一个原因是程序中有死循环&#xff1b;如果是java…

docker操作之mysql容器

1、创建宿主机器的挂载目录 /opt/docker/mysql/conf /opt/docker/mysql/data /opt/docker/mysql/logs 2、创建【xxx.cnf】配置文件&#xff0c;内容如下所示&#xff1a; [mysqld]#服务唯一Idserver-id 1port 3306log-error /var/log/mysql/error.log #只能用IP地址skip_nam…

Windows10系统下wsappx占用CPU资源过高?wsappx是什么?如何关闭wsappx进程?

在Windows10系统开机的时候&#xff0c;wsappx进程占用的CPU资源非常高&#xff0c;导致电脑运行速度缓慢&#xff0c;那么我们如何关闭wsappx进程&#xff0c;让电脑加快运行速度呢&#xff1f;下面就一起来看一下操作的方法吧。 【现象】 1、先来看一下电脑刚开机的时候&…

如何通过Windows Server 2008 R2建立NFS存储

如何通过Windows Server 2008 R2建立NFS存储在我们日常工作的某些实验中&#xff0c;会需要使用存储服务器。而硬件存储成本高&#xff0c;如StarWind之类的iSCSI软存储解决方案需要单独下载服务器端程序&#xff0c;且配置比较繁琐&#xff0c;令很多新手们很是头疼。事实上&a…

python-windows安装相关问题

1.python的环境配置&#xff0c;有些时候是没有配置的&#xff0c;需要在【系统环境】-【path】里添加。 2.安装pip&#xff1a;从官网下载pip包&#xff0c;然后到包目录》python setup.py install 安装 3.安装scrapyd&#xff1a;正常使用pip3 install scrapyd安装不起&…

hdu 1542/1255 Atlantis/覆盖的面积

1542 1255 两道扫描线线段树的入门题。 基本没有什么区别&#xff0c;前者是模板&#xff0c;后者因为是求覆盖次数至少在两次以上的&#xff0c;这个同样是具有并集性质的&#xff0c;所以把cover的判断条件更改一下就可以了qwq。 hdu1542 代码如下&#xff1a; #include<i…

使用了JDK自带的jconsole查看Tomcat运行情况

最近对公司的项目进行JVM调优&#xff0c;使用了JDK自带的jconsole查看Tomcat运行情况&#xff0c;记录下配置以便以后参考&#xff1a;首先&#xff0c;修改Tomcat的bin目录下的catalina.bat文件&#xff0c;在JAVA_OPTS变量中添加下面四行&#xff0c;即可set JAVA_OPTS %JAV…

jvm02

java虚拟机内存管理 每个线程就是一个顺序的执行单元&#xff0c;线程共享区即多个线程共享同一块区域&#xff0c;线程独占区即每个线程都有自己的虚拟机栈&#xff0c;本地方法栈&#xff0c;程序计数器。 程序计数器是一个比较小的内存空间&#xff0c;可以看作是当前线程所…

搭建svn管理平台

安装svn服务器&#xff1a;yum -y install subversion创建svn的目录&#xff1a;mkdir -p /data/svn初始化svn目录&#xff1a;svnadmin create /data/svnconf下的三个目录介绍&#xff1a;authz&#xff1a;控制权限,创建用户。密码在passwd创建 passwd&#xff1a;密码文件&…

Oracle dataguard 正常切换和应急切换

Oracle dataguard 正常切换和应急切换oracle dataguard提供异地容灾方案,能有效的防止单点故障和提供高可用技术,这里介绍dataguard正常主备切换和应急切换&#xff08;应急切换模拟主库出现问题无法还原,备库脱离dataguard接管主库对外提供服务&#xff09;1&#xff09;Oracl…

好程序员web前端分享JS引擎的执行机制

好程序员web前端分享JS引擎的执行机制&#xff0c;请先着重牢记两点&#xff01;JS是单线程语言。JS的EventLoop是JS的执行机制。深入了解JS的执行&#xff0c;就等于深入了解JS里的eventloop。1、灵魂三问&#xff1a;JS为什么是单线程的?为什么需要异步?单线程又是如何实现…

shutil模块、json和pickle模块

shutil模块&#xff1a; 高级的文件、文件夹、压缩包处理模块 json和pickle模块 之前学过eval内置方法可以将一个字符串转化成Python对象&#xff0c;但eval方法是有局限性的&#xff0c;对于普通的数据类型&#xff0c;json.loads、eval都可以使用&#xff0c;但遇到特殊类型的…

每日一问:LayoutParams 你知道多少?

前面的文章中着重讲解了 View 的测量流程。其中我提到了一句非常重要的话&#xff1a;**View 的测量匡高是由父控件的 MeasureSpec 和 View 自身的 LayoutParams 共同决定的。**我们在前面的 每日一问&#xff1a;谈谈对 MeasureSpec 的理解 把 MeasureSpec 的重点进行了讲解&a…

kuangbin专题十六 KMP扩展KMP HDU2594 Simpsons’ Hidden Talents

Homer: Marge, I just figured out a way to discover some of the talents we weren’t aware we had. Marge: Yeah, what is it? Homer: Take me for example. I want to find out if I have a talent in politics, OK? Marge: OK. Homer: So I take some politician’s na…