无论是网站还是小程序中，页面的切换是必不可少的存在。本篇文章就来介绍在uni-app中如何封装一个通用的跳转方法，来供全局页面进行使用，减少代码量及便于后期维护。

如下所示，封装的方法中包含：redirectTo、switchTab、reLaunch、navigateBack、navigateTo五种页面跳转方式。

在utils文件夹下创建gopage.js文件

export function goPage(url, type) {
	switch (type) {
		case 'redirect':
			uni.redirectTo({ url })
			break;
		case 'tab':
			uni.switchTab({ url })
			break;
		case 'reLaunch':
			uni.reLaunch({ url })
			break;
		case 'back':
			uni.navigateBack()
			break;
		default:
			uni.navigateTo({ url })
	}
}

在main.js中引入gopage.js文件

import App from './App'
import * as util from '@/utils/utils.js'
// #ifndef VUE3
import Vue from 'vue'
import './uni.promisify.adaptor'
Vue.prototype.$util = util
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
  ...App
})
app.$mount()
// #endif

// #ifdef VUE3
import { createSSRApp } from 'vue'
export function createApp() {
  const app = createSSRApp(App)
  return {
    app
  }
}
// #endif

在页面中使用goPage通用跳转方法

uni.navigateTo页面切换
this.$util.goPage('/pages/index/index')
switchTab页面
this.$util.goPage('/pages/index/index',tab)

注：如这些常用的功能，最好还是设置一个公用方法。这样不仅便于使用，更方便后期进行管理操作。