微信小程序常见页面跳转操作简单示例
本文实例讲述了微信小程序常见页面跳转操作。分享给大家供大家参考,具体如下:
1.保留当前页面,跳转到应用内另一个页面:wx.navigateTo({ url: '页面路径', })
实例:
pageSkip :function(){
wx.navigateTo({
url: '/page/admin/details',
})
},
2.关闭当前页面,返回到上一级或多级页面:wx.navigateBack({ url: '页面路径', })
实例:
pageSkip :function(){
wx.navigateBack({
url: '/page/admin/shops',
})
},
3.关闭当前页面,跳转到应用内某个页面:wx.redirectTo({ url: '页面路径', })
实例:
pageSkip :function(){
wx.redirectTo({
url: '/page/index/one',
})
},
4.关闭所有页面,打开应用内某个页面:wx.reLaunch({ url: '页面路径', })
实例:
pageSkip :function(){
wx.reLaunch({
url: '/page/login/two',
})
},
5.跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面:wx.switchTab({ url: '页面路径', })
实例:
pageSkip :function(){
wx.switchTab({
url: '/page/shops/homepage',
})
},
附:wxml内页面跳转:
<navigator url="页面路径" open-type="navigate"></navigator>
实例:
<navigator url="/pages/admin/goodsOrder" open-type="navigate">
希望本文所述对大家微信小程序开发有所帮助。
相关推荐
-
微信小程序 页面跳转传参详解
微信小程序 页面跳转传参,做微信小程序必定会用的这样的功能,这里就记录下本人学习实现代码资料. 刚接触微信小程序,多里面的语法和属性还不怎么聊解,如有不多的地方希望各位大神多多指教.今天来说下微信小程序怎么跳转和传参,话不多说直接上代码. 实现的功能是给列表增加点击功能传参到下一页: 代码如下: <import src="../WXtemplate/headerTemplate.wxml"/> <view> <!--滚动图--> <view&g
-
微信小程序 页面跳转及数据传递详解
微信小程序 页面跳转及数据传递详解 类似 Android 的 Intent 传值,微信小程序也一样可以传值: 例如:wxml 中写了一个函数跳转: <view class="itemWeight" catchtap="jumpToOverMissionList"> <view class="textStatus">已完成任务</view> <view class="containVertical
-
微信小程序实现页面跳转传值以及获取值的方法分析
本文实例讲述了微信小程序实现页面跳转传值以及获取值的方法.分享给大家供大家参考,具体如下: 在安卓中页面跳转传值都是通过bundle,现在研究一下小程序的列表跳转及页面传值. my.wxml <view class="container"> <view bindtap="bindViewTap" class="userinfo"> <image class="userinfo-avatar" sr
-
微信小程序 页面跳转和数据传递实例详解
微信小程序 页面跳转和数据传递 1.先导 在Android中,我们Activity和Fragment都有栈的概念在里面,微信小程序页面也有栈的概念在里面.微信小程序页面跳转有四种方式: 1.wx.navigateTo(OBJECT): 2.wx.redirectTo(OBJECT): 3.wx.switchTab(OBJECT): 4.wx.navigateBack(OBJECT) 5.使用实现对应的跳转功能: 分析: 其中navigateTo是将原来的页面保存在页面栈中,在跳入到下一个页面的时
-
微信小程序 页面跳转传值实现代码
微信小程序 页面跳转传值实现代码 微信小程序的页面路径只能是五层: 现在场景如下: index(首页)打开新页面 list(列表)打开新页面search(条件查询)确定条件返回 list(列表): 这里有个限制,微信只能打开五层网页,意味着:在search页面点击确定的时候是要返回上一页: wx.navigateBack(OBJECT) 该api是无法带参数返回上一页的,微信给出的方法是在全局变量里面添加对象:(真特么操蛋) app.js加入变量search search:'', 后续js头部全
-
微信小程序BindTap快速连续点击目标页面跳转多次问题处理
问题描述: 1)wxml片段 <view bindtap="loadMulti"> <text>连续点击,加载多次</text> </view> <view bindtap="loadOnce"> <text>连续点击,加载一次</text> </view> 2)js代码片段 loadMulti:function(e) { wx.navigateTo({ url: '/p
-
微信小程序 详解页面跳转与返回并回传数据
微信小程序 详解页面跳转与返回并回传数据 A页面: .wxml文件 <view class="flex-wrp"> <text style="width: 32%;">选择城市</text> <input style="width: 68%;" type="text" bindtap="city" placeholder="请选择城市" valu
-
微信小程序 页面跳转传递值几种方法详解
微信小程序 页面跳转传递值 微信小程序导航有两种形式:一种是在写在js中进行跳转,另一种是写在wxml页面中进行跳转. 1.js导航 (1).wx.navigateTo(OBJECT) :保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面. wx.navigateTo({ url: 'test?id=1' }) 获取传递的值: //test.js Page({ onLoad: function(option){ console.log(option.id)
-
微信小程序之页面跳转和参数传递的实现
微信小程序之页面跳转和参数传递的实现 前言: 在微信小程序里面的跳转其实和html里的超链接a差不多,我们实现跳转可以通过标签实现,也可以通过js实现,下面一一演示给大家看一下. 在展示demo前,我们需要先简单的建好项目文件夹做好准备.如下: 标签实现 小程序里面有一个类似于a标签的navigator标签,用来做跳转处理. index页面: <navigator url="../navigator/navigator?title=我是navi">跳转到新的页面</n
-
微信小程序 页面跳转事件绑定的实例详解
微信小程序 页面跳转事件绑定的实例详解 什么是事件 事件是视图层到逻辑层的通讯方式. 事件可以将用户的行为反馈到逻辑层进行处理. 事件可以绑定在组件上,当达到触发事件,就会执行逻辑层中对应的事件处理函数. 事件对象可以携带额外信息,如 id, dataset, touches. 在组件中绑定一个事件处理函数. 如bindtap,当用户点击该组件的时候会在该页面对应的Page中找到相应的事件处理函数 <view bindtap="view"> <text bindtap
随机推荐
- MSScriptControl.ScriptControl组件的用法实例
- iOS仿支付宝芝麻信用分数仪表盘动画效果
- 文章中优酷视频全屏及去除广告在线转换
- IOS开发代码分享之用nstimer实现倒计时功能
- js轮播图透明度切换(带上下页和底部圆点切换)
- JavaScript实现页面实时显示当前时间的简单实例
- JavaScript如何从listbox里同时删除多个项目
- php $_SERVER windows系统与linux系统下的区别说明
- ckeditor的使用和配置方法分享
- mysql 增加修改字段类型及删除字段类型
- jQuery实现点击该行即可删除HTML表格行
- 浅谈JavaScript中的属性:如何遍历属性
- 详解Java的Struts框架中注释的用法
- ASP.NET 页面间数据传递方法小结
- Android开发之HTTP访问网络
- Java使用DateUtils对日期进行数学运算经典应用示例【附DateUtils相关包文件下载】
- python数据抓取分析的示例代码(python + mongodb)
- 使用Python写一个小游戏
- python在文本开头插入一行的实例
- 解决mpvue + vuex 开发微信小程序vuex辅助函数mapState、mapGetters不可用问题
