微信小程序中不同页面传递参数的操作方法

更新时间：2023年12月07日 12:05:32 作者：开心点啦.

这篇文章主要介绍了微信小程序中不同页面传递参数的操作方法,在开发项目中,避免不了不同页面之间传递数据等,那么就需要进行不同页面之间的一个数据传递的,需要的朋友可以参考下

直接传递一个对象时：

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

到此这篇关于微信小程序中不同页面如何传递参数的文章就介绍到这了,更多相关微信小程序页面传递参数内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

js实现幻灯片播放图片示例代码
幻灯片播放图片的效果想必大家都有见到过吧，下面有个不错的示例，感兴趣的朋友可以参考下
2013-11-11
JavaScript实现一键复制文本功能的示例代码
这篇文章主要为大家介绍两种javascript实现文本复制（将文本写入剪贴板）的方法，文中的示例代码讲解详细，大家可以根据需求特点选用
2023-03-03
js怎么只刷新当前页面一次
Javascript刷新页面的几种方法：location.reload()、location.replace(location)、history.go(0)、location=location、location.assign(location)、document.execCommand('Refresh')、window.navigate(location)、document.URL=location.href,js怎么只刷新当前页面一次呢
2023-09-09
js异步接口并发数量控制的方法示例
这篇文章主要给大家介绍了关于js异步接口并发数量控制的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-11-11
ES6数组与对象的解构赋值详解
这篇文章主要介绍了ES6数组与对象的解构赋值,结合实例形式详细分析了ES6中数组与对象的解构赋值原理、用法及相关操作注意事项,需要的朋友可以参考下
2019-06-06
给Javascript数组插入一条记录的代码
给Javascript数组插入一条记录的代码...
2007-08-08
js实现轮播图效果 z-index实现轮播图
这篇文章主要为大家详细介绍了js实现轮播图效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-01-01
用循环或if语句从json中取数据示例
倘若想将id和pid数据依次取出，就只能用循环，若想有选择性的输出时，需要添加if条件
2014-08-08
js获取input标签的输入值实现代码
input标签的输入值通过js进行获取，部分标签和类是封装在框架内的，其效果和html标签差不多，具体实现如下，感兴趣的朋友可以参考下，希望对大家有所帮助
2013-08-08
省市区三级联动下拉框菜单javascript版
这篇文章主要给大家介绍了javascript实现省市区三级联动下拉框菜单，有需要的朋友可以参考下
2015-08-08