通过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. 微信小程序路由跳转

    微信小程序路由跳转 1.wx.switchTab(Object object) 这里的tabBar是底下的导航栏指定的页面, 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 参数 O ...

  2. 一个C#程序员学习微信小程序路由的笔记

    路由大家应该都知道,在微信小程序也是有的,毕竟它是单页面应用程序.在WeChat中有五种跳转方式,分别是wx.switchTab.wx.reLaunch.wx.redirectTo.wx.naviga ...

  3. 微信小程序 路由跳转 异步请求 存储数据,微信登录接口

    1小程序路由跳转 wx.switchTab(Object object) 这里的tabBar是底下的导航栏指定的页面 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 tabBar l ...

  4. 微信小程序商城 带java后台源码

    微信小程序商城(Java版) 演示地址 账号:admin 密码:admin 小程序体验码: 技术选型 1 后端使用技术 1.1 springframework4.3.7.RELEASE 1.2 myb ...

  5. 10 微信小程序路由跳转

    一.四种跳转方式 API路由详解 除了tabBar这种底部跳转的方法,我们还有路由跳转,以下四种方式: 1. wx.switchTab() :跳转到 tabBar 页面,并关闭其他所有非 tabBar ...

  6. 微信小程序页面带参数跳转

    页面传递参数的方式 data-para js获取参数

  7. 微信小程序页面带参数跳转及接收参数内容navigator

    功能从index页面跳转到draw页面,并在draw页面获取id及imgUrl index.wxml <navigator class='looks-view' wx:for="{{i ...

  8. 微信小程序--页面传参

    场景: A页面字段---传递到-->B页面 A页面wxml: wx:for----习惯用<block> 设置所点击的值----data-xxx 获取所点击的值---e.current ...

  9. 微信小程序路由跳转(navigateTo,redirectTo ,switchTab ,reLaunch )

    navigateTo, redirectTo 只能打开非 tabBar 页面. switchTab 只能打开 tabBar 页面. reLaunch 可以打开任意页面. 通过redirect重定向的页 ...

随机推荐

  1. springboot+mybatis实现数据库的读写分离

    介绍 随着业务的发展,除了拆分业务模块外,数据库的读写分离也是常见的优化手段.方案使用了AbstractRoutingDataSource和mybatis plugin来动态的选择数据源选择这个方案的 ...

  2. python_进程与线程的补充

    进程与线程的标识 知识点一:进程id 与 线程ident import time import multiprocessing import threading time.sleep(10) prin ...

  3. Geoserver发布强制显示标签处理

    TextSymbolizer 增加如下配置: <!--  标签重叠也显示  --> <VendorOption name="conflictResolution" ...

  4. SpringBoot中使用Interceptor

    https://www.cnblogs.com/chao555/p/9573102.html 1.创建自定义的拦截器并实现HandlerInterceptor接口 package com.demo.c ...

  5. 阿里巴巴 Java 开发手册 (六) 并发处理

    1. [强制]获取单例对象需要保证线程安全,其中的方法也要保证线程安全. 说明:资源驱动类.工具类.单例工厂类都需要注意. 2. [强制]创建线程或线程池时请指定有意义的线程名称,方便出错时回溯. 正 ...

  6. Http异常状态码解决方案。

    415出现的原因:一般是传参的时候传的是json格式的参数,解决办法:先添加信息头管理器,然后在里面添加:(名称:Content-type)(值:application/json),这样就可以识别js ...

  7. 【初识算法】- AC算法

    原文地址:https://www.cnblogs.com/jily/p/6250716.html 一.原理 AC自动机首先将模式组记录为Trie字典树的形式,以节点表示不同状态,边上标以字母表中的字符 ...

  8. Swiper4的基本使用

    基本介绍: 中文文档地址:https://www.swiper.com.cn/ 它是一个开源,免费,强大的触摸滑动插件. 它是用纯Javascript打造的滑动特效插件,既可用于PC端,也可用于移动端 ...

  9. 理解 Node.js 中 Stream(流)

    Stream(流) 是 Node.js 中处理流式数据的抽象接口. stream 模块用于构建实现了流接口的对象. Node.js 提供了多种流对象. 例如,对 HTTP 服务器的request请求和 ...

  10. ETL讲解

    ETL是将业务系统的数据经过抽取.清洗转换之后加载到数据仓库的过程,目的是将企业中的分散.零乱.标准不统一的数据整合到一起,为企业的决策提供分析依据. ETL是BI项目重要的一个环节. 通常情况下,在 ...