小程序路由跳轉封裝,5中常用,2種跳轉其他小程序

我用的uni-app框架寫的小程序,把 “uni” 開頭的api換成 “wx” 就可以了

新建router.js導出模塊

export default {

	/** 
	 * 1.function
	 * @param {string} url 目標頁面的路由
	 * @param {Object} param 傳遞給目標頁面的參數
	 * @description 處理目標頁面的參數,轉成json字符串傳遞給param字段,在目標頁面通過JSON.parse(options.param)接收
	 */
	navigateTo(url, param = {}) {
		if (param) {
			url += `?param=${JSON.stringify(param)}`
		}
		uni.navigateTo({
			url: url,
			fail(err) {
				console.log('navigateTo跳轉出錯', err)
			},
		})
	},

	/** 
	 * 2.function
	 * @param {string} url 目標頁面的路由
	 * @param {Object} param 傳遞給目標頁面的參數,只有頁面棧無目標頁面調用navigateTo時,參數纔會生效,單單返回不能設置參數
	 * @description 先取出頁面棧,頁面棧最多十層,判斷目標頁面是否在頁面棧中,如果在,則通過目標頁的位置,返回到目標頁面,否則調用navigateTo方法跳轉到目標頁
	 */
	navigateBack(url, param = {}) {
		const pagesList = getCurrentPages()
		let index = pagesList.findIndex(e => {
			return url.indexOf(e.route) >= 0
		})
		if (index == -1) { // 沒有在頁面棧中,可以調用navigateTo方法
			this.navigateTo(url, param)
		} else {
			uni.navigateBack({
				delta: pagesList.length - 1 - index,
				fail(err) {
					console.log('navigateBack返回出錯', err)
				}
			})
		}
	},

	// 3.封裝switchTab,switchTab不能有參數
	switchTab(url) {
		uni.switchTab({
			url: url
		})
	},
	// 4.封裝redirectTo,和navigateTo沒啥區別
	redirectTo(url, param = {}) {
		if (param) {
			url += `?param=${JSON.stringify(param)}`
		}
		uni.redirectTo({
			url: url,
			fail(err) {
				console.log('redirectTo跳轉出錯', err)
			},
		})
	},
	// 5.封裝reLaunch,和navigateTo沒啥區別
	reLaunch(url, param = {}) {
		if (param) {
			url += `?param=${JSON.stringify(param)}`
			// 要根據具體業務來, 該返回就返回, 該跳轉就用跳轉, 不能一直跳轉!
		}
		uni.reLaunch({
			url: url,
			fail(err) {
				console.log('reLaunch跳轉出錯', err)
			},
		})
	},
	/**
	 * 6.function 打開另一個小程序,僅供小程序
	 * @param {String} appId 目標小程序ID
	 * @param {String} path 目標小程序的頁面路徑
	 * @param {Object}  extraData 傳給目標小程序的數據
	 * @param {String}  envVersion 目標小程序版本號
	 */
	//appId 如果爲空則打開首頁(path 中 ? 後面的數據可以再小程序的 App.onLaunch、App.onShow 和 Page.onLoad 的回調函數當中獲取到,
	// extraData(object) 需要傳遞給目標小程序的數據(目標小程序可在 App.onLaunch,App.onShow 中獲取到傳過來的數據),
	// envVersion 要打開的小程序版本。僅在當前小程序爲開發版或體驗版時此參數有效。如果當前小程序是正式版,則打開的小程序必定是正式版。
	navigateToMiniProgram(appId, path, extraData, envVersion) {
		uni.navigateToMiniProgram({
			appId: appId,
			path: path,
			extraData: extraData,
			envVersion: envVersion,
			fail(err) {
				console.log('打開另外小程序失敗', err)
			}
		})
	},
	// 7.返回打開的上個小程序
	//extraData(object) 需要返回給上一個小程序的數據,上一個小程序可在 App.onShow 中獲取到這份數據。
	navigateBackMiniProgram(extraData) {
		uni.navigateBackMiniProgram({
			extraData: extraData,
			fail(err) {
				console.log('返回上個小程序失敗', err)
			}
		})
	}
}

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章