Nuxt3 使用路由中间件实现pc端和手机端路由相互跳转

1.在根目录下创建middleware目录，添加一个以.global为后缀的js或ts文件

image.png

2.default.global.js

export default defineNuxtRouteMiddleware((to, from) => {
  if (process.server){ // 在服务器端处理路由
    const nuxtApp = useNuxtApp()
  } else { // 在客户端处理路由
    // 是否是移动端设备
    const isMobile = /(Android|webOS|iPhone|iPod|tablet|BlackBerry|Mobile)/i.test(navigator.userAgent)
    // 是否是手机端路由
    const isRouterMobile = /mobile/i.test(to.fullPath)
    if ( !isMobile && isRouterMobile){ // 手机端路由跳转pc端
      let path = to.fullPath.replace('/mobile','')
      return navigateTo(path)
    } else if(isMobile && !isRouterMobile){ // pc端路由跳转手机端
      let path = '/mobile' + to.fullPath.slice(0,to.fullPath.length-1)
      return navigateTo(path)
    }
  }
})