微信小程序路由带参
通过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重定向的页 ...
随机推荐
- Linux基础(03)gdb调试
1. 安装GDB增强工具 (gef) * GDB的版本大于7.7 * wget -q -O- https://github.com/hugsy/gef/raw/master/scripts/gef.s ...
- ELK 索引生命周期管理
kibana 索引配置 管理索引 点击设置 --- Elasticsearch 的 Index management 可以查看 elk 生成的所有索引 (设置,Elasticsearch ,管理) 配 ...
- 手写ORM入门篇(一)
对象关系映射(英语:(Object Relational Mapping,简称ORM,或O/RM,或O/R mapping),是一种程序技术,用于实现面向对象编程语言里不同类型系统的数据之间的转换 . ...
- 解决打开IE报错“无法启动...丢失api-ms-win-core-path-l1-1-0.dll”的问题
打开IE突然发现报错 试了各种方法都不行 最终看这篇文章,才解决:https://www.yijile.com/log/577.html 打开IE设置选项,选择管理加载项,如图讲该选项禁用,就不报错. ...
- 【转载】C#使用ToList()将数组快速转换为List集合
在C#的编程中,数组和List集合是比较常用的两个集合类,有时候因为业务需要,需要将数组集合转换为List集合,此时就可以使用C#中的Linq的扩展方法ToList方法来实现,只需要简单的一条语句即可 ...
- nodeJS从入门到进阶二(网络部分)
一.网络服务器 1.http状态码 1xx: 表示普通请求,没有特殊含义 2xx:请求成功 200:请求成功 3xx:表示重定向 301 永久重定向 302 临时重定向 303 使用缓存(服务器没有更 ...
- django 自定义身份认证
自定义身份认证: Django 自带的认证系统足够应付大多数情况,但你或许不打算使用现成的认证系统.定制自己的项目的权限系统需要了解哪些一些关键点,即Django中哪些部分是能够扩展或替换的.这个文档 ...
- php 弹窗案例
<?php // 弹出对话框并且返回原来的页面 echo "<script language=\"JavaScript\">\r\n"; ec ...
- elasticsearchTemplate操作es
ElasticsearchTemplate是spring对java api的封装 maven依赖: <dependency> <groupId>org.springframew ...
- 数据库与数据仓库的区别实际讲的是OLTP与OLAP的区别
什么是数据仓库 数据仓库,英文名称为Data Warehouse,可简写为DW或DWH.数据仓库,是为企业所有级别的决策制定过程,提供所有类型数据支持的战略集合.它出于分析性报告和决策支持目的而创建. ...