• 微信小程序路由带参


    通过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 获取当前的页面栈,决定需要返回几层。
    
  • 相关阅读:
    mysql数据库函数 concat 字段类型转化、字段拼接
    SSH2中的No result defined for action的问题
    导致表单重复提交(两次)的原因--css{url()}与a标签
    详解jar命令打包生成双击即可运行的Java程序
    21IO流 和缓冲流 和处理流
    20File
    19(1)hashmap,hashtable
    IntelliJ IDEA注册码激活
    19映射
    18泛型
  • 原文地址:https://www.cnblogs.com/xinzaiyuan/p/12049662.html
Copyright © 2020-2023  润新知