[Vue warn]: Error in render function: "TypeError: Cannot read property 'matched' of undefined"

Question

我正在尝试使用两个路由器路由两个页面， main.js 和 profile.js 和两个初始化文件 main 和 profile

//for main pages
import Vue from 'vue';
import App from './App';
import MainRouter from './router/main.js';


Vue.config.productionTip = false

/* eslint-disable no-new */
/* vue init for main pages with MainRouter */
new Vue({
  el: '#main-app',
  MainRouter,
  template: '<App/>',
  components: { 
    App
  }
})

import Vue from 'vue';
import App from './App';
import ProfileRouter from './router/profile.js'

Vue.config.productionTip = false

/* eslint-disable no-new */
/* vue init for profile pages with profile pages router */
new Vue({
  el: '#profile-app',
  ProfileRouter,
  template: '<App/>',
  components: { 
    App
  }
})

路由器是..

/* Router for main pages */

import Vue from 'vue'
import Router from 'vue-router'

/* pages */
import Meeting from '@/components/pages/meeting'
import Feeds from '@/components/pages/feeds'


Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'Feeds',
      component: Feeds
    },
    {
      path: '/meeting',
      name: 'Meeting',
      component: Meeting
    },
    {
      path: '/activities',
      name: 'Activities History',
      component: Activities
    },
    {
      path: '/add_member',
      name: 'Add Member',
      component: Add_Member
    }
  ]
})

profile.js

/* Router for profile related pages */
import Vue from 'vue'
import Router from 'vue-router'

/* pages */
import Activities from '@/components/pages/activities_history'
import Change_Password from '@/components/pages/change_password'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'Edit Profile',
      component: Edit_Profile
    },
    {
      path: '/activities',
      name: 'Activities History',
      component: Activities
    }
  ]
})

如果需要，我将包含更多代码... 当只有一个路由器时它工作正常。你能解决问题吗？提前致谢

Answer 1

将路由器添加到 Vue 时，必须使用名称 router。

new Vue({
  el: '#main-app',
  router: MainRouter,
  template: '<App/>',
  components: { 
    App
  }
})

new Vue({
  el: '#profile-app',
  router: ProfileRouter,
  template: '<App/>',
  components: { 
    App
  }
})

Vue 不知道 ProfileRouter 或 MainRouter 是什么。重要的是要记住语法

{ router }

是 shorthand 对于

{ router: router }

那是 introduced with ES2015。

[Vue warn]: Error in render function: "TypeError: Cannot read property 'matched' of undefined"

[Vue warn]: Error in render function: "TypeError: Cannot read property 'matched' of undefined"

javascript

ecmascript-6

vue.js

vue-router

vuejs2