本文介绍微信小程序中不同页面间传递数据的方法。主要讲解两种常见场景：一是直接传递对象，需通过JSON.stringify和encodeURIComponent进行编码处理；二是更常用的传递ID方式，页面B接收ID后重新请求数据。文章提供了完整的JavaScript跳转代码与WXML自定义属性设置示例，并提示data-*属性在后端会转为小写。
在开发微信小程序项目时，经常需要实现不同页面之间的数据交互与传递。
直接传递一个对象时：
页面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中根据该ID重新发起数据请求。
wxml
通过设置传递参数 id=“传递的值” 来实现参数传递。
使用 data-* 自定义属性进行设置。需要注意的是，在后端接收数据时，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);
},
});以上就是关于微信小程序中不同页面如何传递参数的介绍，更多相关微信小程序页面传递参数内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！