vue项目判断 是否是移动端 再依据判断跳转

2019-02-23  本文已影响0人  岁末Zzz

在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();

    }

  }

})

上一篇 下一篇

猜你喜欢

热点阅读