vue routerはモバイル端末によって自動的にPC端末が異なるページを開く

1.routerで2つの異なるルーティングアドレスエントリを構成する

{
  path: '/loginPhone',
  name: 'loginPhone',
  component: loginPhone
},
{
  path: '/login',
  name: 'login',
  component: _import('common/login')
}

詳細:

import Vue from 'vue'
import Router from 'vue-router'
import Home from '../pages/home.vue'
import MHome from '../pages/mHome.vue'

Vue.use(Router)

export default new Router({
  mode:"history",
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    },
    {
      path: '/m',
      name: 'mHome',
      component: MHome
    }
  ]
})

2 Appを構成する.vue

  export default {
    name: 'login',
    mounted () {
      if (this._isMobile()) {
        // alert("   ");
        this.$router.replace('/loginPhone')
      } else {
        // alert("pc ");
        this.$router.replace('/login')
      }
    },
    methods: {
      _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)
        return flag
      }
    }
  }

パスの下でnpm run buildパブリッシュマッピングをパッケージ化すると実現できます