一、功能描述

頁面跳轉時，同時把當前頁面的數據傳遞給跳轉的目標頁面，并在跳轉后的目標頁面進行展示

二、功能實現

1. 代碼實現

test1頁面

// pages/test1/test1.js Page({/*** 頁面的初始數據*/data: {name:'Tom',age:'12'},buttonListener:function(){var that =?thiswx.navigateTo({url:?'/pages/test2/test2?nameData='?+ that.data.name +?'&ageData='?+ that.data.age})} })<!--pages/test1/test1.wxml--> <view> <text>姓名：{{name}}</text> </view> <view> <text>年齡：{{age}}</text> </view> <button bindtap='buttonListener'>攜帶數據跳轉</button>

test2頁面

// pages/test2/test2.js Page({/*** 頁面的初始數據*/data: {name:null,age:null},/*** 生命周期函數--監聽頁面加載*/onLoad: function (options) {var that = thisthat.setData({name:options.nameData,age:options.ageData})} })<!--pages/test2/test2.wxml--> <view> <text>姓名為：{{name}}</text> </view> <view> <text>年齡為：{{age}}</text> </view>

　　

2. 代碼分析

1. test1頁面

（1）Button點擊事件

　　案例中采用了點擊button觸發跳轉事件，所以要為button添加一個監聽函數。在test1.wxml頁面的<button>中添加bindTap屬性，來命名該button的監聽函數名稱。然后在test1.js中實現該監聽函數即可

（2）跳轉函數

　　微信小程序提供自帶的頁面跳轉函數，具體可參考微信小程序API；

　　跳轉時攜帶數據：　?url:?'/pages/test2/test2?數據a的名稱='?+ 數據a的內容 +?'&數據b的名稱='?+ 數據b的內容,?

?

2. test2頁面

（1）接收數據

　　使用onLoad函數在加載頁面時接收數據，通過options.數據a的名稱來獲取數據a的內容，并賦值給本地變量

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的微信小程序：页面跳转时传递数据到另一个页面的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。