如何判断当前环境是移动端还是 PC 端进入不同的页面最近在群里看到判断当前环境是移动端还是PC端的一个题目，突然想到曾经

学习过程中将笔记整理跟大家分享，希望对大家也有所帮助，共同成长进步💪~
如果大家喜欢，可以点赞或留言💕~~~~，谢谢大家⭐️⭐️⭐️~~~

最近在群里看到判断当前环境是移动端还是PC端的一个题目，突然想到曾经我做过呀还写了文章记录，今天这里再总结一下O(∩_∩)O

通过user-agent值，来进行判断，使用javascript框架中的Navigator对象的userAgent属性

方案一

function IsPC(){  
    var userAgentInfo = navigator.userAgent;
    var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"); 
    var flag = true;  
    for (var v = 0; v < Agents.length; v++) {  
        if (userAgentInfo.indexOf(Agents[v]) > 0) { 
            flag = false; break; 
        }  
    }  
    return flag;  
 }
var routerFlag = IsPC();
sessionStorage.setItem('flag',routerFlag);

路由判断分别进入pc还是移动端
判断路由代码如下：

var flagRouter = JSON.parse(sessionStorage.getItem('flag'));
var routers = [];
if (!flagRouter) {
    routers = [
        {
            path: '/',
            redirect: '/ui/login'
        },
        {
            path: '/ui/login',
            name: 'mobileLogin',
            component: mobileLogin
        },
        {
            path: '/ui/index',
            name: 'mobileIndex',
            component: mobileIndex,
            meta: {
                requireAuth: true  // 添加该字段，表示进入这个路由是需要登录的
            },
        }
    ]
} else {
    routers = [
        {
          path: '/',
          redirect: '/ui/login'
        },
        {
          path: '/ui/login',
          name: 'login',
          component: login
        },
        {
          path: '/ui/index',
          name: 'index',
          component: index,
          meta: {
            requireAuth: true  // 添加该字段，表示进入这个路由是需要登录的
          },
          children: [
            {
              path: '/ui/totalfloor',
              name: 'totalfloor',
              component: totalfloor,
              meta: {
                requireAuth: true  // 添加该字段，表示进入这个路由是需要登录的
              },
            },
            {
              path: '/ui/pointsfloor',
              name: 'pointsfloor',
              component: pointsfloor,
              meta: {
                requireAuth: true  // 添加该字段，表示进入这个路由是需要登录的
              },
            },    
      ]
}

方案二

function IsPC() {
    var userAgentInfo = navigator.userAgent;
    var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod");
    var flag = true;
    flag = !Agents.some((v) => {
        return userAgentInfo.indexOf(v) > 0
    })
    return flag;
}
var routerFlag = IsPC();
sessionStorage.setItem('flag',routerFlag);

使用Array.prototype.some方法
路由判断分别进入pc还是移动端如方案一类似这里不再重复了哈O(∩_∩)O

还有些其他方法可以根据个人项目是改动，仅个人总结，希望对大家也有所帮助
最后感谢大家阅读，如果喜欢可以点赞或留言💕~~~~，谢谢大家⭐️⭐️⭐️~~~O(∩_∩)O

近期热门文章

专栏推荐

推荐一下自己的专栏，欢迎大家收藏关注😊~