vue动态加载组件

WrWeeklyWorkReport: resolve => require(['@/pages/workWeeklyManage/workWeekly/draftEdit.vue'], resolve)

 

引入组件

//正常加载
import index from '../pages/index.vue'
import view from '../pages/view.vue'
//懒加载
const index = resolve => require(['../pages/index.vue'], resolve)
const view = resolve => require(['../pages/view.vue'], resolve)
//懒加载 - 按组
const index = r => require.ensure([], () => r(require('../pages/index.vue')), 'group-index')
const view = r => require.ensure([], () => r(require('../pages/view.vue')), 'group-view')
// 懒加载 - 按组 import，基于ES6 import的特性
const index = () => import('../pages/index.vue')
const view = () => import('../pages/view.vue')

根据业务需求，需要动态加载不同的页面，则通过vue的component组件，

 

 

 通过懒加载，动态引入组件页面，加载

typeComponents: resolve => require(['@/pages/workWeeklyManage/workWeekly/draftEdit.vue'], resolve)