微信小程序中的页面跳转(通过点击按钮、调用方法的形式)

简介: 这篇文章讲解了微信小程序中页面跳转的方法,包括使用按钮点击事件和调用方法实现跳转,以及推荐使用`this.pageRouter.navigateTo`代替`wx.navigateTo`的方式。

页面跳转用的多吧、tabBar的空间有限。通过路由的方式跳转时Vue中常用的方式、小程序采用类似的做法。

这里通过给按钮绑定点击事件、调用方法、方法中实现页面跳转。(其它方式暂不考虑)

1、效果

小程序之页面跳转

2、官网实例

// index/index.js
Page({
  wxNavAction: function () {
    wx.navigateTo({
      url: './new-page'
    })
  },
  routerNavAction: function () {
    this.pageRouter.navigateTo({
      url: './new-page'
    })
  }
})

注意:this.pageRouter.navigateTo 代替 wx.navigateTo 是更优的

3、实际使用

  • login.wxml
<button type="primary" size="mini" bindtap="onRegister" >注册</button>
</view>
  • login.js
  /**
   * 注册
   */
  onRegister(){
    this.pageRouter.navigateTo({
      url: '../register/register'
    })

  },

目录结构
在这里插入图片描述

相关文章
|
小程序
小程序消除图片下边距的三个方法
小程序消除图片下边距的三个方法
581 167
|
数据安全/隐私保护
陌陌头像留V的最好方法,陌陌最新留QQ号技巧,陌陌动态最聪明的留微信
本资料分享社交平台隐秘留联系方式的方法,包含微信头像艺术化处理、二维码变形术,以及QQ号谐音替换、图片分割等技巧。
|
Web App开发 移动开发 小程序
公众号小程序H5网页像素流送UE5模型的方法分享
本文探讨了如何通过像素流送技术在小程序、公众号等平台展示复杂的3D模型(如UE5引擎开发的楼盘模型、数字孪生展厅)。该技术将GPU和CPU算力需求转移到服务器端,使用户侧无需高性能硬件即可流畅体验。通过Webrtc实现实时云渲染,确保毫秒级响应,且兼容多种浏览器。使用点量云流等产品级软件,老项目只需重新打包为EXE格式,即可轻松嵌入H5网页、小程序或公众号中,支持Unity、WebGL等多种3D应用及传统CAD模型。
559 1
|
缓存 小程序 API
微信小程序页面导航与路由:实现多页面跳转与数据传递
本文深入探讨微信小程序的页面导航与路由机制,介绍多种页面跳转方式如`wx.navigateTo`、`wx.redirectTo`、`wx.switchTab`等,并讲解通过URL、全局变量和事件传递数据的方法。结合案例实现多页面跳转与数据传递,帮助开发者掌握这一重要技能。
|
小程序 安全
Fiddler抓取小程序后端请求导入AppScan扫描快捷方法
【8月更文挑战第26天】这是一种利用 Fiddler 捕获小程序后端请求并导入 AppScan 进行安全扫描的方法。首先安装配置 Fiddler 并设置手机代理,通过 Fiddler 捕获请求;接着导出这些请求为 .saz 文件,并在 AppScan 中导入此文件,配置扫描参数后启动扫描以检测安全漏洞。操作时需确保有合法授权并遵循相关法规。尽管不同版本软件操作细节可能有所不同,但整体流程类似。
820 1
|
小程序 JavaScript API
小程序实现分享的三种方法
【8月更文挑战第20天】
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
4547 7
|
小程序 JavaScript 前端开发
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
5107 1
|
人工智能 自然语言处理 小程序
技术小白如何利用DeepSeek半小时开发微信小程序?
通过通义灵码的“AI程序员”功能,即使没有编程基础也能轻松创建小程序或网页。借助DeepSeek V3和R1满血版模型,用户只需用自然语言描述需求,就能自动生成代码并优化程序。例如,一个文科生仅通过描述需求就成功开发了一款记录日常活动的微信小程序。此外,通义灵码还提供智能问答模式,帮助用户解决开发中的各种问题,极大简化了开发流程,让普通人的开发体验更加顺畅。
4095 11
技术小白如何利用DeepSeek半小时开发微信小程序?

热门文章

最新文章