vue根据设备展示页面判断当前设备是手机端或者pc端

项目 router 文件夹下的 index.js 中有两个路由,分别是 pc 端路由和移动端路由

export default new Router({
  routes: [
    {
      path: '/',
      redirect:'/pc-home'
    },
    // pc端的路由
    {
      path:'/pc-home',
      name:'pc-home',
      component:()=>import('@/components/pc/Home')
    },
    // 手机端的路由
    {
      path:'/phone-home',
      name:'phone-home',
      component:()=>import('@/components/phone/Home')
    }
  ]
})

 在 App.vue 中判断当前设备进行跳转路由

 

export default new Router({
  routes: [
    {
      path: '/',
      redirect:'/pc-home'
    },
    // pc端的路由
    {
      path:'/pc-home',
      name:'pc-home',
      component:()=>import('@/components/pc/Home')
    },
    // 手机端的路由
    {
      path:'/phone-home',
      name:'phone-home',
      component:()=>import('@/components/phone/Home')
    }
  ]
})

  

posted @ 2021-12-27 10:02  文采呱呱  阅读(188)  评论(0编辑  收藏  举报