Detailed explanation of WeChat applet navigateTo data transfer

This article mainly introduces relevant information to you about the examples of WeChat applet using navigateTo data transmission. I hope this article can help you. Friends in need can refer to it. I hope it can help you.

Instance of WeChat applet using navigateTo data transfer

1, passing basic data type

index. js Send page JS

Page({ 
 data: { 
  testStr: '字符串str' 
 }, 
 onLoad: function () { 
 }, 
 next: function(e){ 
  wx.navigateTo({ 
   url: '/pages/test/test?str='+this.data.testStr, 
  }) 
 } 
})

test.js Accept page JS

Page({ 
 data:{ 
 }, 
 onLoad:function(options){ 
  console.log("接收到的参数是str="+options.str); 
 } 
})

printed Log is as follows:

The received parameter is str=string str

2, passing object {}

index.js Send Page JS

Page({ 
 data: { 
  dataObj:{name:'我是name', extra:'我是extra'} 
 }, 
 onLoad: function () { 
 }, 
 toTest: function(e){ 
  wx.navigateTo({ 
   url: '/pages/test/test?dataObj='+JSON.stringify(this.data.dataObj) 
  }) 
 } 
})

test.js Accept page JS

Page({ 
 data:{ 
  dataObj:null 
 }, 
 onLoad:function(options){   
  this.dat.dataObj= JSON.parse(options.dataObj);//解析得到对象 
 }})

The printed Log is as follows ：

test.js [sm]:16 The received parameter is obj={"name":"I am name","dataObj":"I am dataObj"}

3, pass the array collection []

index.js Send page JS

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

test.js Accept page JS

Page({ 
 data:{ 
  list:[] 
 },  
onLoad:function(options){   
  console.log("接收到的参数是list="+options.list);//此处打印出来的是字符串，解析如下    
  this.data.list = JSON.parse(options.list);//解析得到集合
 }})

The printed Log is as follows:

test.js [sm]:17 The received parameter is list=["item-A" ,"item-B"]

Related recommendations:

Detailed explanation of Vue components and data transfer

How to implement Javascript Transfer data between forms?

How to transfer data between vue.js components

The above is the detailed content of Detailed explanation of WeChat applet navigateTo data transfer. For more information, please follow other related articles on the PHP Chinese website!