草庐IT

微信小程序路径跳转和传参

白云~️ 2024-02-07 原文

  1.路径跳转

注意：使用声明式导航(标签)跳转 那个跳转标签默认是一行都可以点击 范围有点大不灵活

<!-- 路径前面要加 "/" 拼接绝对路径 -->
<!-- 声明式导航 标签这一行都可以点击 通过标签到指定路径 -->
<navigator url="/pages/index/index" open-type="switchTab" > <button>到首页</button> </navigator>

 建议使用通过点击触发函数改变路径

 <!-- 函数式导航 控制点击区域 通过按钮触发事件到指定路径 -->
 <view>当前是详情页</view>
 <button bindtap="back">返回</button>
 <button bindtap="click" >到首页</button>
 <button bindtap="click1" >到购买页面</button>
 <button bindtap="click2" >替换</button>
 <button bindtap="click3" >初始化</button>
 //这个是详情页 非tabBar页面

  back() {
  // 返回到之前的路径页面 不能是tabBar页面 返回多少次由delta: 1,控制1就是返回到上一次的路径页面
    wx.navigateBack({
      delta: 1,
    });
  },
   // 修改路径
   click() {
     // 跳转到一个指定的tabBar页面
    wx.switchTab({
      url: "/pages/index/index",
    });
  },
  click1() {
    //跳转到一个指定的非tabBar页面
    wx.navigateTo({
      url: "/pages/gm/index",
    });
  },
  click2() {
    //替换当前路径到指定页面
    wx.redirectTo({
      url: "/pages/index/index",
    });
  },
  click3() {
   //删除全部路径到指定页面
    wx.reLaunch({
      url: '/pages/index/index',
    })
  },

 wx.navigateBack ({})：返回到之前的路径页面 不能是tabBar页面 返回多少次由delta: 1,控制1就是返回到上一次的路径页面
 wx.switchTab({})：跳转到一个指定的tabBar页面
 wx.navigateTo({})：跳转到一个指定的非tabBar页面
 wx.redirectTo({})：替换当前路径到指定页面 不区分tabBar
 wx.reLaunch({})：删除全部路径到指定页面 不区分tabBar

 非tabBar页面就是在pages里面  但是不在tabBar的list里面注册的普通页面

注：pages里面排第一的默认为进来展示的页面(首页)，可以根据需求改变进来的页面

 注：list里面的排列顺序就是底部栏的排列顺序，可以根据需求改变顺序(list至少两个最多五个)

 2.路径传参

直接在跳转的路径后面拼接参数 ?a=1&b=2&c=3"

// 到详情页
  click2() {
    wx.navigateTo({
      url: "/pages/qx/index?a=1&b=2&c=3",
    });
  },
 // 详情页接收参数
onLoad(options) {
    // console.log(options);
    var obj = options;
    this.setData({
      obj: obj,
    });
  },
<text>使用路径传参的参数</text>
<view>a:{{obj.a}}</view>
<view>b:{{obj.b}}</view>
<view>c:{{obj.c}}</view>

微信小程序微信strongbuttontabBar小程序

有关微信小程序路径跳转和传参的更多相关文章

  1. ruby-on-rails - Rails - 使用/自定义 URL : '/dashboard' 指定根路径 - 2

    如何使此根路径转到:“/dashboard”而不仅仅是http://example.com？root:to=>'dashboard#index',:constraints=>lambda{|req|!req.session[:user_id].blank?} 最佳答案 您可以通过以下方式实现:root:to=>redirect('/dashboard')match'/dashboard',:to=>"dashboard#index",:constraints=>lambda{|req|!req.session[:user_id].b

  2. 微信小程序通过字典表匹配对应数据 - 2

    前言一般来说，前端根据后台返回code码展示对应内容只需要在前台判断code值展示对应的内容即可，但要是匹配的code码比较多或者多个页面用到时，为了便于后期维护，后台就会使用字典表让前端匹配，下面我将在微信小程序中通过wxs的方法实现这个操作。为什么要使用wxs？{{method(a,b)}}可以看到，上述代码是一个调用方法传值的操作，在vue中很常见，多用于数据之间的转换，但由于微信小程序诸多限制的原因，你并不能优雅的这样操作，可能有人会说，为什么不用if判断实现呢？但是if判断的局限性在于如果存在数据量过大时，大量重复性操作和if判断会让你的代码显得异常冗余。wxswxs相当于是一个独立

  3. 计算机毕业设计ssm+vue基本微信小程序的小学生兴趣延时班预约小程序 - 2

    项目介绍随着我国经济迅速发展,人们对手机的需求越来越大,各种手机软件也都在被广泛应用,但是对于手机进行数据信息管理,对于手机的各种软件也是备受用户的喜爱小学生兴趣延时班预约小程序的设计与开发被用户普遍使用,为方便用户能够可以随时进行小学生兴趣延时班预约小程序的设计与开发的数据信息管理,特开发了小程序的设计与开发的管理系统。小学生兴趣延时班预约小程序的设计与开发的开发利用现有的成熟技术参考,以源代码为模板,分析功能调整与小学生兴趣延时班预约小程序的设计与开发的实际需求相结合,讨论了小学生兴趣延时班预约小程序的设计与开发的使用。开发环境开发说明：前端使用微信微信小程序开发工具：后端使用ssm：VU

  4. 微信小程序开发入门与实战（Behaviors使用） - 2

    @作者:SYFStrive @博客首页:HomePage📜：微信小程序📌：个人社区（欢迎大佬们加入）👉：社区链接🔗📌：觉得文章不错可以点点关注👉：专栏连接🔗💃：感谢支持,学累了可以先看小段由小胖给大家带来的街舞👉微信小程序（🔥）目录自定义组件-behaviors    1、什么是behaviors    2、behaviors的工作方式    3、创建behavior    4、导入并使用behavior    5、behavior中所有可用的节点    6、同名字段的覆盖和组合规则总结最后自定义组件-behaviors    1、什么是behaviorsbehaviors是小程序中，用于实现

  5. ruby - 如何根据长度将路径数组转换为嵌套数组或散列 - 2

    我需要根据字符串路径的长度将字符串路径数组转换为符号、哈希和数组的数组给定以下数组:array=["info","services","about/company","about/history/part1","about/history/part2"]我想生成以下输出，对不同级别进行分组，根据级别的结构混合使用符号和对象。产生以下输出:[:info,:services,about:[:company,history:[:part1,:part2]]]#altsyntax[:info,:services,{:about=>[:company,{:history=>[:part1,:pa

  6. ruby-on-rails - 如何播种图像的路径？ - 2

    Organization和Image具有一对一的关系。Image有一个名为filename的列，它存储文件的路径。我在Assets管道中包含这样一个文件:app/assets/other/image.jpg。播种时如何包含此文件的路径？我已经在我的种子文件中尝试过:@organization=...@organization.image.create!(filename:File.open('app/assets/other/image.jpg'))#Ialsotried:#@organization.image.create!(filename:'app/assets/other/i

  7. Ruby 和指南针路径与 yeoman 项目 - 2

    我安装了ruby​​、yeoman，当我运行我的项目时，出现了这个错误:Warning:Running"compass:dist"(compass)taskWarning:YouneedtohaveRubyandCompassinstalledthistasktowork.Moreinfo:https://github.com/gruUse--forcetocontinue.Use--forcetocontinue.我有进入可变session目标的路径，但它不起作用。谁能帮帮我？ 最佳答案 我必须运行这个:geminstallcom

  8. 对象的 Ruby 方法查找路径 - 2

    是否有内置的Ruby方法或众所周知的库可以返回对象的整个方法查找链？Ruby查看一系列令人困惑的类(如thisquestion中所讨论)以查找与消息对应的实例方法，如果没有类响应消息，则调用接收方的method_missing。我将以下代码放在一起，但我确信它遗漏了某些情况或者它是否100%正确。请指出任何缺陷并指导我找到一些更好的代码(如果存在)。defmethod_lookup_chain(obj,result=[obj.singleton_class])ifobj.instance_of?Classreturnadd_modules(result)ifresult.last==B

  9. ruby-on-rails - rails 中的路径解析 - 2

    我正在寻找这样解析路由路径的方法:ActionController::Routing.new("post_path").parse#=>{:controller=>"posts",:action=>"index"}应该和url_for相反更新我发现:Whatistheoppositeofurl_forinRails?Afunctionthattakesapathandgeneratestheinterpretedroute?ActionController::Routing::Routes.recognize_path("/posts")所以现在我需要将posts_path转换为“/p

  10. Ubuntu20.04系统WineHQ7.0安装微信 - 2

    提供3种Ubuntu系统安装微信的方法，在Ubuntu20.04上验证都ok。1.WineHQ7.0安装微信：ubuntu20.04安装最新版微信--可以支持微信最新版，但是适配的不是特别好；比如WeChartOCR.exe报错。2.原生微信安装：linux系统下的微信安装(ubuntu20.04)--微信适配的最好，反应最快，但是微信版本只到2.1.1，版本太老，很多功能都没有。3.深度deepin-wine6安装微信：ubuntu20.04+系统deepin-wine6安装新版微信--综合比较好，当前个人使用此种方法1个月，微信版本3.4；没什么大问题，尚可。一、WineHQ7.0安装微信

随机推荐