小程序 路由传参 技能升级

Posted 成都阿信

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了小程序 路由传参 技能升级相关的知识,希望对你有一定的参考价值。

方案一:

//A页面 实现跳转

      jump: function () 

         let a = 1;

         let b = 2;

      wx.navigateTo(

            url: /page/b/b?data1= + a + &data2= + b

       )

  

  //B页面  接收参数
         onLoad: function (options) 
                //此时A页面传递的参数由options接收,A页面传递参数时的参数名分别叫data1和data2,所以B页面想拿到A页面传递的参数拿对应的参数名即可
                  let data1 = options.data1;
                  let data2 = options.data2;

              console.log(data1);//输出的结果是  1
              console.log(data2);//输出的结果是  2

方案二:

a页面
 godeposit(e) 
      // console.log(e.currentTarget.dataset)
      let aa =JSON.stringify(e.currentTarget.dataset);
      app.navigateTo("pages/my/deposit/deposit?data1="+ aa)
    
b页面
onLoad: function (options) 
    let a =JSON.parse(options.data1);
     console.log(a)

方案三:最新方案,解决大数据传输问题:
参考文档:https://developers.weixin.qq.com/miniprogram/dev/api/route/EventChannel.html

传参模式:

let obj = 
  disease_ids: strIds,
  disease_name: strNames,

uni.navigateTo(
 // url:`/packageA/pages/estimateQuestion/estimateQuestion?disease_ids=$strIds&disease_name=$strNames`,
  url:`/packageA/pages/estimateQuestion/estimateQuestion`,
  success: function (res) 
    res.eventChannel.emit(getData, obj)  //触发事件
  
)

接收模式:

onLoad: function(options)  //接收页面
    const eventChannel = this.getOpenerEventChannel();
    eventChannel.on("getData",data => 
        console.log(data)
    );

以上是关于小程序 路由传参 技能升级的主要内容,如果未能解决你的问题,请参考以下文章

小程序路由传参

小程序路由传参的时候出现数据丢失

uniapp小程序路由跳转navigator传参封装

微信小程序Page页面跳转(路由/返回)并传参

路由传参并接收参数

路由传参和路由守卫