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


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 相关文章推荐
JavaScript的类型简单说明
Sep 03 Javascript
javascript在子页面中函数无法调试问题解决方法
Jan 17 Javascript
在Mac OS下使用Node.js的简单教程
Jun 24 Javascript
jquery实现图片预加载
Dec 25 Javascript
微信js-sdk预览图片接口及从拍照或手机相册中选图接口用法示例
Oct 13 Javascript
浅谈js之字面量、对象字面量的访问、关键字in的用法
Nov 20 Javascript
利用Js的console对象,在控制台打印调式信息测试Js的实现
Nov 26 Javascript
jQuery选择器中的特殊符号处理方法
Sep 08 jQuery
nuxt+axios解决前后端分离SSR的示例代码
Oct 24 Javascript
基于vue通用表单解决方案的思考与分析
Mar 16 Javascript
js实现html滑动图片拼图验证
Jun 24 Javascript
原生js+css实现tab切换功能
Sep 17 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
解析PHP SPL标准库的用法(遍历目录,查找固定条件的文件)
2013/06/18 PHP
PHP获取当前日期和时间及格式化方法参数
2015/05/11 PHP
php根据用户名和手机号查询是否存在手机号码
2017/02/16 PHP
firefox浏览器下javascript 拖动层效果与原理分析代码
2007/12/04 Javascript
基于Jquery 解决Ajax请求的页面 浏览器后退前进功能,页面刷新功能实效问题
2010/12/11 Javascript
yepnope.js 异步加载资源文件
2011/09/08 Javascript
jquery判断元素是否隐藏的多种方法
2014/05/06 Javascript
jquery获取选中的文本和值的方法
2014/07/08 Javascript
jquery实现对联广告的方法
2015/02/05 Javascript
JavaScript实现文字跟随鼠标特效
2015/08/06 Javascript
js匿名函数作为函数参数详解
2016/06/01 Javascript
node.js cookie-parser 中间件介绍
2016/06/06 Javascript
Javascript 创建类并动态添加属性及方法的简单实现
2016/10/20 Javascript
jquery.validate[.unobtrusive]和Bootstrap实现tooltip错误提示问题分析
2016/10/30 Javascript
老生常谈原生JS执行环境与作用域
2016/11/22 Javascript
AngularJS之自定义服务详解(factory、service、provider)
2017/04/14 Javascript
在React 组件中使用Echarts的示例代码
2017/11/08 Javascript
vue如何通过id从列表页跳转到对应的详情页
2018/05/01 Javascript
微信小程序自定义组件封装及父子间组件传值的方法
2018/08/28 Javascript
jQuery实现的点击显示隐藏下拉菜单功能完整示例
2019/05/17 jQuery
让mocha支持ES6模块的方法实现
2020/01/14 Javascript
微信小程序自定义弹出模态框禁止底部滚动功能
2020/03/09 Javascript
vue实现一个6个输入框的验证码输入组件功能的实例代码
2020/06/29 Javascript
vue 重塑数组之修改数组指定index的值操作
2020/08/09 Javascript
Python3.6笔记之将程序运行结果输出到文件的方法
2018/04/22 Python
python爬虫获取新浪新闻教学
2018/12/23 Python
Python之pymysql的使用小结
2019/07/01 Python
Django Admin中增加导出Excel功能过程解析
2019/09/04 Python
input元素的url类型和email类型简介
2012/07/11 HTML / CSS
描述JSP和Servlet的区别、共同点、各自应用的范围
2012/10/02 面试题
工程管理英文求职信
2014/03/18 职场文书
小学课外活动总结
2014/07/09 职场文书
2015年党员个人剖析材料
2014/12/18 职场文书
2015年学校减负工作总结
2015/05/19 职场文书
沂蒙六姐妹观后感
2015/06/08 职场文书
angular4实现带搜索的下拉框
2022/03/25 Javascript