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


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用法
May 10 Javascript
Javascript生成json的函数代码(可以用php的json_decode解码)
Jun 11 Javascript
使用Chrome调试JavaScript的断点设置和调试技巧
Dec 16 Javascript
jQuery代码实现图片墙自动+手动淡入淡出切换效果
May 09 Javascript
BootStrap Validator使用注意事项(必看篇)
Sep 28 Javascript
js放大镜放大购物图片效果
Jan 18 Javascript
node.js调用Chrome浏览器打开链接地址的方法
May 17 Javascript
简单介绍react redux的中间件的使用
Apr 06 Javascript
快速解决brew安装特定版本flow的问题
May 17 Javascript
小程序页面动态配置实现方法
Feb 05 Javascript
深度了解vue.js中hooks的相关知识
Jun 14 Javascript
Vue router安装及使用方法解析
Dec 02 Vue.js
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如何调用webservice应用介绍
2012/11/24 PHP
php中序列化与反序列化详解
2017/02/13 PHP
javascript 静态对象和构造函数的使用和公私问题
2010/03/02 Javascript
javascript 用记忆函数快速计算递归函数
2010/03/15 Javascript
解决jquery中美元符号命名冲突问题
2014/01/08 Javascript
Nodejs使用mysql模块之获得更新和删除影响的行数的方法
2014/03/18 NodeJs
JavaScript动态修改网页元素内容的方法
2015/03/21 Javascript
Javascript实现飞动广告效果的方法
2015/05/25 Javascript
在JavaScript中处理时间之setMinutes()方法的使用
2015/06/11 Javascript
分享纯手写漂亮的表单验证
2015/11/19 Javascript
jQuery密码强度验证控件使用详解
2017/01/05 Javascript
原生js实现无限循环轮播图效果
2017/01/20 Javascript
jQuery插件FusionCharts实现的2D饼状图效果【附demo源码下载】
2017/03/03 Javascript
移动端刮刮乐的实现方式(js+HTML5)
2017/03/23 Javascript
Vue.js实现文章评论和回复评论功能
2020/05/30 Javascript
JavaScript脚本语言是什么_动力节点Java学院整理
2017/06/26 Javascript
js实现省市级联效果分享
2017/08/10 Javascript
Vue+ElementUI实现表单动态渲染、可视化配置的方法
2018/03/07 Javascript
详解如何在vue-cli中使用vuex
2018/08/07 Javascript
详解JSON和JSONP劫持以及解决方法
2019/03/08 Javascript
以Flask为例讲解Python的框架的使用方法
2015/04/29 Python
qpython3 读取安卓lastpass Cookies
2016/06/19 Python
python中字符串变二维数组的实例讲解
2018/04/03 Python
python遍历文件夹,指定遍历深度与忽略目录的方法
2018/07/11 Python
python 接收处理外带的参数方法
2018/12/03 Python
Python利用lxml模块爬取豆瓣读书排行榜的方法与分析
2019/04/15 Python
Python imutils 填充图片周边为黑色的实现
2020/01/19 Python
VSCode配合pipenv搞定虚拟环境的实现方法
2020/05/17 Python
python 下载文件的几种方法汇总
2021/01/06 Python
Python中对象的比较操作==和is区别详析
2021/02/12 Python
Monnier Frères美国官网:法国知名奢侈品网站
2016/11/22 全球购物
环保倡议书
2014/04/14 职场文书
银行保安拾金不昧表扬稿
2015/05/05 职场文书
《成长的天空》读后感3篇
2019/12/06 职场文书
详解非极大值抑制算法之Python实现
2021/06/28 Python
《乙女游戏世界对路人角色很不友好》OP主题曲无字幕动画MV公开
2022/04/05 日漫