微信小程序路由带参
通过url带参传递
- wxml
<navigator url="../user/user?id={{item.id}}&name={{item.name}}">点此进入 detail</navigator>
- js
onLoad: function (options) {
this.setData({
user_id: options.id,
user_name: options.name
}),
success:function(){
console.log('接口调用成功')
},
fail:function(){
console.log('接口调用失败')
},
complete:function(){
console.log('调用结束,调用成功失败都会执行')
}
}
点击事件传参
- wxml
<view wx:for='{{list}}' data-item='{{item}}' data-id='{{item.id}}' bindtap='goDetail'></view>
- js
goDetail: function(e){
let id = e.currentTarget.dataset.id;
wx.navigateTo({
url: '../index-detail/index-detail?id=' + id
})
}
- 跳转页面取值
onLoad(options){
console.log(options.id)//options.id就是传递的参数。
}
点击事件在js中赋值
- wxml
<view bindtap="passQuery" data-index="1">点击事件传参</view>
- js
passQuery: function(e){
let query = e.currentTarget.dataset['index'];
}
注意
1. wx.navigateTo({url:""})
保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层。
2. wx.redirectTo()
关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面
3. wx.switchTab()
wx.switchTab({
url: '../../pages/reg/reg',
# success:function(){
# console.log('caled switchtab ')
# }
})
跳转到 tabBar 页面,并关闭其他所有非tabBar页面
4. wx.reLaunch()
关闭所有页面,打开到应用内的某个页面(可以带参数跳转到tabBar)
5.wx.navigateBack()
关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈,决定需要返回几层。
微信小程序路由带参的更多相关文章
- 微信小程序路由跳转
微信小程序路由跳转 1.wx.switchTab(Object object) 这里的tabBar是底下的导航栏指定的页面, 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 参数 O ...
- 一个C#程序员学习微信小程序路由的笔记
路由大家应该都知道,在微信小程序也是有的,毕竟它是单页面应用程序.在WeChat中有五种跳转方式,分别是wx.switchTab.wx.reLaunch.wx.redirectTo.wx.naviga ...
- 微信小程序 路由跳转 异步请求 存储数据,微信登录接口
1小程序路由跳转 wx.switchTab(Object object) 这里的tabBar是底下的导航栏指定的页面 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 tabBar l ...
- 微信小程序商城 带java后台源码
微信小程序商城(Java版) 演示地址 账号:admin 密码:admin 小程序体验码: 技术选型 1 后端使用技术 1.1 springframework4.3.7.RELEASE 1.2 myb ...
- 10 微信小程序路由跳转
一.四种跳转方式 API路由详解 除了tabBar这种底部跳转的方法,我们还有路由跳转,以下四种方式: 1. wx.switchTab() :跳转到 tabBar 页面,并关闭其他所有非 tabBar ...
- 微信小程序页面带参数跳转
页面传递参数的方式 data-para js获取参数
- 微信小程序页面带参数跳转及接收参数内容navigator
功能从index页面跳转到draw页面,并在draw页面获取id及imgUrl index.wxml <navigator class='looks-view' wx:for="{{i ...
- 微信小程序--页面传参
场景: A页面字段---传递到-->B页面 A页面wxml: wx:for----习惯用<block> 设置所点击的值----data-xxx 获取所点击的值---e.current ...
- 微信小程序路由跳转(navigateTo,redirectTo ,switchTab ,reLaunch )
navigateTo, redirectTo 只能打开非 tabBar 页面. switchTab 只能打开 tabBar 页面. reLaunch 可以打开任意页面. 通过redirect重定向的页 ...
随机推荐
- 不会前后端,用vps搭建个人博客(二)
<接上一篇> 四.添加网页内容 1.下载安装WordPress 输入以下命令: wget https://wordpress.org/latest.tar.gz 当然你也可以用浏览器进 ...
- 1139 First Contact PAT (Advanced Level)
原题链接: https://pintia.cn/problem-sets/994805342720868352/problems/994805344776077312 测试点分析: 首先来分析一下测试 ...
- drf中的各种view,viewset
drf中的各种view,viewset Django REST framework里有各种各样的view,让我有点蒙,得好好捋一捋这关系. 视图的作用 Django用"视图"这个概 ...
- 关于定义变量名为"name"的坑!!!
昨天下午没有什么工作可做,闲来无事就上博客园看看了,有个问题让我一直很纳闷. 直接上代码吧: 再用表达式创建函数时遇到的问题,这里的代码按照正常逻辑只有那个在变量定义后面的函数执行打印的值才是&quo ...
- JavaScript 相关的工具代码
博客地址:https://ainyi.com/49 记录一些数据处理需要的方法工具代码 持续更新中... 时间戳转与日期格式相互转换 时间戳转换成日期格式 function timestampToTi ...
- R语言包在linux上的安装等知识
有关install.packages()函数的详见:R包 package 的安装(install.packages函数详解) R的包(package)通常有两种:1 binary package:这种 ...
- 攻防世界WEB高手进阶之Zhuanxv
1.一开始就是一个时钟界面 2.扫描目录发现/list 目录 打开是后台登陆,看了一下源码,也没发现什么,焦灼... 3.百度上搜了一波wp,发现原来在css里面藏了东西 后台的背景图片居然是这样读取 ...
- JVM——垃圾回收资格的判定
一:判断一个对象是否已死 1:引用数算法:给对象加个引用计数器,被引用时加一,引用失效减一,在任何时刻一直为0的就说明不会被使用,但是由于一种情况的存在,导致这种算法不被JVM所考虑,在两个对象相互引 ...
- 编译heartbeat出现的问题
如报 cc1: warnings being treated as errors pils.c:245: error: initialization fromincompatible pointer ...
- 瑞克和莫蒂|S3E03 Rick为什么要把自己变成一根腌黄瓜?
给尚未入坑Rick and Morty的小伙伴们为一点背景知识 S3E1在说什么? rick从监狱里回来,顺手搞垮了统治地球的银河联邦政府.Jerry因此丢了工作,非常不高兴.于是向Beth质问 ...