微信小程序--页面间的通信和页面跳转传参

最近在做微信小程序时，涉及到了把值从一个页面传递到另一个页面的问题，在网上查阅了一些资料，在这里总结一下常用的方法。

1、页面跳转时，在跳转的url中传递，比如：

1. wx.navigateTo({
2. url: '../InfoContent/InfoContent?id=1'
3. });

在InfoContent页面：

1. onLoad: function (options) {
2. //页面初始化 options为页面跳转所带来的参数
3. var s = this;
4. var id=options.id;//获取值
5. }

2、全局变量的形式  app.js代码：

1. globalData:{
2. id: 1
3. }

赋值代码：

1. var app = getApp();
2. app.globalData.id=2

取值代码：

1. var app = getApp();
2. var id=app.globalData.id;

1、pagejump.wxml:

1. <view class="page">
2.  
3. <button type="default" bindtap="onBtnClick">跳转到新页面</button>
4. </view>

2、pagejump.js

1. Page({
2. data: {
3. lastval: {},
4. showBtn: false,
5. },
6. onLoad: function (options) {
7. // 生命周期函数--监听页面加载
8. var that = this;
9. console.log('onLoad is invoked');
10. console.log(options);
11. that.setData({
12. lastval: options.val,
13.  
14. })
15. },
16. onBtnClick: function () {
17. var that = this;
18. console.log('onBtnClick');
19. wx.navigateTo({
20. url: '../home/home?tp=2&index=hello bright&showBtn=false',
21. success: function (res) {
22. // success
23. console.log('onBtnClick success() res:');
24. },
25. fail: function () {
26. // fail
27. console.log('onBtnClick fail() !!!');
28. },
29. complete: function () {
30. console.log('onBtnClick complete() !!!');
31. // complete
32. }
33. })
34. }
35. })

3、home.wxml:

1. <view class="test">新页面新页面tp=={{tp}}</view>
2. <view class="test">新页面新页面showBtn=={{showBtn}}</view>
3. <view class="test">新页面新页面index=={{index}}</view>

4、home.js:

1. Page({
2. data: {
3. tp:'',
4. showBtn: '',
5. index:'',
6. },
7. onLoad: function (options) {
8. // 生命周期函数--监听页面加载
9. var that = this;
10. console.log('onLoad is invoked');
11. that.setData({
12. tp: options.tp,
13. index: options.index,
14. showBtn: (options.showBtn == "true" ? true : false),
15. });
16. console.log("tp="+tp);
17. }
18. })