在app.vue页面写一个判断事件并调用
在这里插入图片描述

_isMobile(){
  let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)
  // localStorage.setItem('isiphone',flag)
  localStorage.setItem('ismobile',flag?1:0)
  return flag;
},

// 判断跳转pc端页面还是移动端页面
// 使用钩子函数对路由进行权限跳转
获取存储的ismobile 进行判断

navigator.userAgent 用来浏览器的user-agent信息
再用match()判断是不是移动端

router.beforeEach((to, from, next) => {

var ismobile = localStorage.getItem('ismobile');

  if(ismobile == null){
    let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)

    ismobile = flag ? 1 : 0
  }

  // 电脑
  if (ismobile == 0) {
    if (to.path == '/') {
        next('/admin_index')
    } else {
        next();
    }
  }

  // 手机
  if (ismobile == 1) {
    if (to.path == '/') {
        next('/home')
    } else {
        next();
    }
  }

})
Logo

前往低代码交流专区

更多推荐