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

news/2024/7/20 2:28:42 标签: 微信小程序, 小程序

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

直接传递一个对象时:

页面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);
    },
});


http://www.niftyadmin.cn/n/5243243.html

相关文章

go语言 | etcd源码导读(一)

参考 本文参考https://zhuanlan.zhihu.com/p/600893553 https://www.topgoer.com/%E6%95%B0%E6%8D%AE%E5%BA%93%E6%93%8D%E4%BD%9C/go%E6%93%8D%E4%BD%9Cetcd/etcd%E4%BB%8B%E7%BB%8D.html 前沿etcd 与 raft etcd是使用Go语言开发的一个开源的、高可用的分布式key-value存储系…

HarmonyOS4.0从零开始的开发教程02初识ArkTS开发语言(上)

HarmonyOS&#xff08;二&#xff09;初识ArkTS开发语言&#xff08;上&#xff09;之TypeScript入门 前言 Mozilla创造了JS&#xff0c;Microsoft创建了TS&#xff0c;而Huawei进一步推出了ArkTS。因此在学习使用ArkTS前&#xff0c;需要掌握基本的TS开发技能。 从最初的基…

机器学习之萤火虫算法(Firefly Algorithm,FA)

萤火虫算法(Firefly Algorithm,FA)是一种启发式优化算法,灵感来自萤火虫的交配行为。该算法最初由Xin-She Yang于2008年提出,用于解决优化问题。它模拟了萤火虫通过发光来吸引其他萤火虫并进行交配的行为,将这一过程应用于寻找最优解。 以下是萤火虫算法的基本思想和步骤…

笔记68:Pytorch中repeat函数的用法

repeat 相当于一个broadcasting的机制 repeat(*sizes) 沿着指定的维度重复tensor。不同与expand()&#xff0c;本函数复制的是tensor中的数据。 import torch import torch.nn.functional as F import numpy as np a torch.Tensor(128,1,512) B a.repeat(1,5,1) print(B.s…

uniapp 打包H5页面时候清除手机缓存问题

最近遇到一个情况&#xff1a; uniapp 写了一个H5 页面&#xff0c;挂在一个小程序上面&#xff0c;但是每次更新代码&#xff0c;新增新功能&#xff0c;总是有的用户看到的还是上一个版本的样式&#xff0c;前端打包的时候&#xff0c;已经在Uniapp项目的根目录下面新建了一个…

Rust与Go:编程语言之争中的双雄对决

第一章&#xff1a;序幕 在编程的大舞台上&#xff0c;每一门编程语言都是一个角色&#xff0c;都有着自己的特色和魅力。Rust和Go&#xff0c;作为近年来崭露头角的新星&#xff0c;正在编程语言的舞台上掀起一阵波澜。本文将深入探讨Rust和Go的发展方向&#xff0c;用幽默而…

Java集合进阶(上)

集合 集合在Java开发中应用极为广泛&#xff0c;它其实就是一些常用的数据结构的包装类&#xff0c;分为单列集合&#xff08;Collecton接口类&#xff0c;例如LinkdeList集合&#xff09;和双列集合&#xff08;Map接口类&#xff0c;例如HashMap集合)两种 Collection Coll…

【Java】实现顺序表基本的操作(数据结构)

文章目录 前言顺序表1、打印顺序表2、增加元素3、在任意位置增加元素4、判断是否包含某个元素5、查找某个元素对于的位置6、获取任意位置的元素7、将任意位置的元素设为value8、删除第一次出现的关键字9、获取顺序表长度10、清空顺序表总结 前言 在了解顺序表之前我们要先了解…