uniapp?switchtab傳參并接收參數(shù)三種方法
方法一:使用全局變量(推薦)
在跳轉(zhuǎn)前存儲(chǔ)數(shù)據(jù):
// 在需要跳轉(zhuǎn)的頁(yè)面 const app = getApp(); app.globalData.tabParams = { key: 'value' // 自定義參數(shù) }; uni.switchTab({ url: '/pages/targetTab/targetTab' });
在目標(biāo)頁(yè)面獲取數(shù)據(jù):
// 目標(biāo) tab 頁(yè)面的 onShow 生命周期中 onShow() { const app = getApp(); const params = app.globalData.tabParams; if (params) { console.log('接收參數(shù):', params); // 使用后清除參數(shù)(避免重復(fù)獲?。? delete app.globalData.tabParams; } }
方法二:使用本地存儲(chǔ)(如 uni.setStorageSync)
在跳轉(zhuǎn)前存儲(chǔ)數(shù)據(jù):
// 在需要跳轉(zhuǎn)的頁(yè)面 uni.setStorageSync('tabParams', { key: 'value' // 自定義參數(shù) }); uni.switchTab({ url: '/pages/targetTab/targetTab' });
在目標(biāo)頁(yè)面獲取數(shù)據(jù):
// 目標(biāo) tab 頁(yè)面的 onShow 生命周期中 onShow() { const params = uni.getStorageSync('tabParams'); if (params) { console.log('接收參數(shù):', params); // 使用后清除存儲(chǔ)(避免重復(fù)獲?。? uni.removeStorageSync('tabParams'); } }
方法三:通過 getApp() 全局共享數(shù)據(jù)
在 App.vue 中定義全局變量:
// App.vue export default { globalData: { tabParams: null } }
跳轉(zhuǎn)前設(shè)置參數(shù):
// 原頁(yè)面 getApp().globalData.tabParams = { key: 'value' }; uni.switchTab({ url: '/pages/targetTab/targetTab' });
目標(biāo)頁(yè)面獲取參數(shù):
// 目標(biāo)頁(yè)面 onShow onShow() { const params = getApp().globalData.tabParams; if (params) { console.log('參數(shù):', params); getApp().globalData.tabParams = null; // 清除參數(shù) } }
總結(jié)
到此這篇關(guān)于uniapp switchtab傳參并接收參數(shù)三種方法的文章就介紹到這了,更多相關(guān)uniapp switchtab傳參并接收參數(shù)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
使用JavaScript實(shí)現(xiàn)圖片的自動(dòng)輪播
在網(wǎng)站開發(fā)中,經(jīng)常會(huì)遇到需要展示多張圖片并自動(dòng)切換的需求,這就需要使用JavaScript來實(shí)現(xiàn)圖片的自動(dòng)輪播功能,本文將通過一個(gè)簡(jiǎn)單的例子,演示如何用JavaScript實(shí)現(xiàn)圖片的自動(dòng)輪播,感興趣的同學(xué)可以自己動(dòng)手試一試2023-09-09Javascript仿PHP $_GET獲取URL中的參數(shù)
這篇文章主要介紹了Javascript仿PHP $_GET獲取URL中的參數(shù)代碼實(shí)例,需要的朋友可以參考下2014-05-05javascript 高級(jí)語(yǔ)法之繼承的基本使用方法示例
這篇文章主要介紹了javascript 高級(jí)語(yǔ)法之繼承的基本使用方法,結(jié)合實(shí)例形式分析了JavaScript繼承的基本使用方法與操作注意事項(xiàng),需要的朋友可以參考下2019-11-11微信小程序項(xiàng)目實(shí)踐之九宮格實(shí)現(xiàn)及item跳轉(zhuǎn)功能
這篇文章主要介紹了微信小程序項(xiàng)目實(shí)踐之九宮格實(shí)現(xiàn)及item跳轉(zhuǎn)功能,需要的朋友可以參考下2018-07-07微信小程序開發(fā)數(shù)據(jù)緩存基礎(chǔ)知識(shí)辨析及運(yùn)用實(shí)例詳解
這篇文章主要介紹了微信小程序開發(fā)數(shù)據(jù)緩存基礎(chǔ)知識(shí)辨析及運(yùn)用實(shí)例詳解,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-11-11