微信小程序开发之页面传取值(数组,对象,字符串)

本文详细介绍了微信小程序中页面间传值的三种方法:利用全局变量、URL携带参数及数据缓存,涵盖字符串、对象和数组的传递技巧。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

原文链接:

微信小程序开发之页面传取值(数组,对象,字符串)


微信小程序页面的传值取值.

小程序传递参数的方式有三种:

(1)通过在App.js中设置全局变量

(2)通过拼接URL直接传递

(3)通过数据缓存存储再获取

1.app.js

通常把不更改的常量数据放在app.js的Data中,在各个页面都可以通过App实例获取Data的数据.

var app = getApp();
var data = app.data;

2.wx.navigateTo({})中URL携带参数

wx.navigateTo({
  url: 'test?id=1'
});

3.数据缓存方式

①wx.setStorageSync(KEY,DATA)存储数据

try {
  wx.setStorageSync('key', 'value')
} catch (e) {    
}

②wx.getStorageSync(KEY)获取数据

try {
  var value = wx.getStorageSync('key')
  if (value) {
    // Do something with return value
  }
} catch (e) {
   // Do something when catch error
}
或
wx.getStorage({
  key: 'key',
  success: function(res) {
     console.log(res.data)
  }
})

1.  传递String字符串

Page({  
  data: {
    testStr: 'xiaochengxu'
  },
  next: function(e){
    wx.navigateTo({
      url: '/test/test?str='+this.data.testStr
    })
  }
})
Page({
  onLoad:function(options){  
    console.log("接收到的参数是str="+options.str);  
  }
})


打印内容:接收到的参数是str=xiaochengxu

2.  传递对象

Page({
  data: {
    testData:{name:'username', password:'password'}  
  },
  next: function(e){
    wx.navigateTo({
       url: '/test/test?testData='+JSON.stringify(this.data.testData)
    })
  }
})
Page({
  data:{
    testData:null
  },
onLoad:function(options){
   console.log("接收到的参数是testData="+options.testData);
   this.data.testData = JSON.parse(options.testData);
}}) 

打印内容:接收到的参数是testData={"name":"username","password":"password"}

3.  传递数组集合

Page({
  data: {
    list:['item-A','item-B']
  },
  next: function(e){
    wx.navigateTo({
      url: '/test/test?list='+JSON.stringify(this.data.list),
    })
  }
})

 

Page({  
  data:{
    list:[]
  },
onLoad:function(options){
   console.log("接收到的参数是list="+options.list); 
   this.data.list = JSON.parse(options.list);  
}})

打印内容:接收到的参数是list=["item-A","item-B"]

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值