微信小程序中 不同页面如何传递参数

在开发项目中,避免不了不同页面之间传递数据等,那么就需要进行不同页面之间的一个数据传递

直接传递一个对象时:

页面A

gotoDetail(e){
    const music = e.currentTarget.dataset.music;
    // 在小程序中,不同页面之间如何进行参数传递?
    // 既然不能传递对象,所以需要将对象进行类型转换
    // encodeURIComponent : 将内容转换为编码
    wx.navigateTo({
        url:
            "/pages/songDetail/songDetail?music=" + 
            encodeURIComponent(JSON.stringify(music)),
    });
},

页面B

Page({
    data:{},
    onLoad(options) {
        console.log( JSON.parse( decodeURIComponent( options.music ) ) );
    },
});

传递ID 

但是通常情况下,我们并不会将对象进行一个传递,而是直接传递一个ID,并在页面B中重新请求

wxml

进行传递参数  id=“传递的值”来进行传递

data-*   自定义属性的设置  但是在后端使用的时候*的内容会全部变成小写

<text
    wx:for={
  {recommendList}}
    wx:key="id"
    class="iconfont icon-gengduo"
    data-music="{
  {item}}"
    data-musicId="{
  {item.id}}"
    bindtap="gotoDetail"
></text>

页面A

gotoDetail(e){
    const musicId = e.currentTarget.dataset.musicid;
    wx.navigateTo({
        url:"/pages/songDetail/songDetail?musicId='' + musicId,
    });
},

页面B

Page({
    data: {},
    onLoad(options){
        console.log(options.musicId);
    },
});

相关推荐

  1. 程序 不同页面如何传递参数

    2023-12-07 15:34:04       42 阅读
  2. 程序:跳转页面

    2023-12-07 15:34:04       43 阅读

最近更新

  1. TCP协议是安全的吗?

    2023-12-07 15:34:04       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2023-12-07 15:34:04       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2023-12-07 15:34:04       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2023-12-07 15:34:04       20 阅读

热门阅读

  1. STM32关键词提取

    2023-12-07 15:34:04       36 阅读
  2. 1.求两个数最大值

    2023-12-07 15:34:04       37 阅读
  3. Python里的OS模块

    2023-12-07 15:34:04       32 阅读
  4. Rust语言项目实战(九 - 完结) - 胜利与失败

    2023-12-07 15:34:04       35 阅读
  5. Ubuntu 安装高版本FFmpeg

    2023-12-07 15:34:04       48 阅读
  6. CSS选择器看一篇就够了

    2023-12-07 15:34:04       41 阅读
  7. Redis击穿(热点key失效)

    2023-12-07 15:34:04       43 阅读
  8. centos 源码编译gcc10.2

    2023-12-07 15:34:04       47 阅读