微信小程序实现跳转的几种方式总结(推荐)


Posted in Javascript onApril 24, 2019

今天把实现微信页面的跳转的几种方法总结分享下

1.使用导航组件,标签,页面链接来实现(可以发现点击时有背景)

<!-- sample.wxml -->
<view class="btn-area">
 <navigator url="../my/my">跳转到新页面</navigator>
</view>

参数如下

微信小程序实现跳转的几种方式总结(推荐)

2.给页面布局加监听bindtap事件,然后在方法里面,通过wx.navigatorTo来实现跳转(保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面)

在my.wxml中加监听bindtap事件

<view bindtap='jump'>跳转</view>

在my.js中实现跳转

jump:function(){
  wx.navigateTo({
   url: '../login/login',
   success: function(res) {

   },
   fail: function(res) {

   },
   complete: function(res) {

   },
  })
 }

参数如下

微信小程序实现跳转的几种方式总结(推荐)

3.通过wx.redirectTo实现跳转(关闭当前页面,跳转到应用内某个页面)

navigateto_index: function (event) { 
 wx.redirectTo({ 
 url: '../index/index', 
 success: function (res) { 
 // success 
 }, 
 fail: function () { 
 // fail 
 }, 
 complete: function () { 
 // complete 
 } 
 }) 

 }

参数如下

微信小程序实现跳转的几种方式总结(推荐)

4.通过wx.navigateBack返回上一级(关闭当前页面。返回上一页面或多级页面)。

wx.navigateBack({ 
 delta: 1, // 回退前 delta(默认为1) 页面 
 success: function (res) { 
 // success 
 }, 
 fail: function () { 
 // fail 
 }, 
 complete: function () { 
 // complete 
 } 
 })

微信小程序实现跳转的几种方式总结(推荐)

以上所述是小编给大家介绍的微信小程序跳转方式详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Jquery Ajax学习实例3 向WebService发出请求,调用方法返回数据
Mar 16 Javascript
ASP.NET jQuery 实例12 通过使用jQuery validation插件简单实现用户注册页面验证功能
Feb 03 Javascript
jQuery Mobile的loading对话框显示/隐藏方法分享
Nov 26 Javascript
JS基于面向对象实现的放烟花效果
May 07 Javascript
jquery通过name属性取值的简单实现方法
Jun 20 Javascript
AngularJS监听路由的变化示例代码
Sep 23 Javascript
KnockoutJS 3.X API 第四章之表单value绑定
Oct 10 Javascript
jquery动态添加文本并获取值的方法
Oct 12 Javascript
node学习记录之搭建web服务器教程
Feb 16 Javascript
基于Vue实现微信小程序的图文编辑器
Jul 25 Javascript
webpack+vue-cli项目中引入外部非模块格式js的方法
Sep 28 Javascript
初学vue出现空格警告的原因及其解决方案
Oct 31 Javascript
vue模仿网易云音乐的单页面应用
Apr 24 #Javascript
微信小程序分享功能onShareAppMessage(options)用法分析
Apr 24 #Javascript
详解关于webpack多入口热加载很慢的原因
Apr 24 #Javascript
微信小程序实现的一键连接wifi功能示例
Apr 24 #Javascript
vue router 通过路由来实现切换头部标题功能
Apr 24 #Javascript
js实现全选反选不选功能代码详解
Apr 24 #Javascript
使用vue2.6实现抖音【时间轮盘】屏保效果附源码
Apr 24 #Javascript
You might like
Terran兵种介绍
2020/03/14 星际争霸
PHP中在数据库中保存Checkbox数据(2)
2006/10/09 PHP
thinkphp常见路径用法分析
2014/12/02 PHP
WordPress开发中自定义菜单的相关PHP函数使用简介
2016/01/05 PHP
php 删除指定文件夹的实例讲解
2017/07/25 PHP
PHP实现验证码校验功能
2017/11/16 PHP
让 JavaScript 轻松支持函数重载 (Part 2 - 实现)
2009/08/04 Javascript
JavaScript中奇葩的假值示例应用
2014/03/11 Javascript
jQuery制作简洁的多级联动Select下拉框
2014/12/23 Javascript
8个超实用的jQuery功能代码分享
2015/01/08 Javascript
jQuery+HTML5实现图片上传前预览效果
2015/08/20 Javascript
jQuery基于扩展实现的倒计时效果
2016/05/14 Javascript
js和C# 时间日期格式转换的简单实例
2016/05/28 Javascript
微信小程序开发之录音机 音频播放 动画实例 (真机可用)
2016/12/08 Javascript
React组件的三种写法总结
2017/01/12 Javascript
JavaScript调试的多个必备小Tips
2017/01/15 Javascript
详解JavaScript对象的深浅复制
2017/03/30 Javascript
bootstrap-table组合表头的实现方法
2017/09/07 Javascript
JavaScript面向对象的程序设计(犯迷糊的小羊)
2018/05/27 Javascript
微信小程序实现默认第一个选中变色效果
2018/07/17 Javascript
原生JS实现的自动轮播图功能详解
2018/12/28 Javascript
JavaScript经典案例之简易计算器
2020/08/24 Javascript
Python中return语句用法实例分析
2015/08/04 Python
Python实现冒泡排序的简单应用示例
2017/12/11 Python
使用C++扩展Python的功能详解
2018/01/12 Python
Python基于分析Ajax请求实现抓取今日头条街拍图集功能示例
2018/07/19 Python
职称自我鉴定
2013/10/15 职场文书
财政专业求职信范文
2014/02/19 职场文书
《小猪家的桃花树》教学反思
2014/04/11 职场文书
公务员培的训心得体会
2014/09/01 职场文书
乡镇干部个人对照检查材料(群众路线)
2014/09/26 职场文书
清洁工个人工作总结
2015/03/05 职场文书
稽核岗位职责范本
2015/04/13 职场文书
赞美教师的句子
2019/09/02 职场文书
PostGIS的安装与入门使用指南
2022/01/18 PostgreSQL
前端canvas中物体边框和控制点的实现示例
2022/08/05 Javascript