Vue中加载组件的另一种形式

  最近在看一个vue的入门项目，看到路由的时候:

这是vue中路由的另一种形式,component中传入一个函数，会自动调用该函数。

require.ensure指的是webpack中的异步加载，

其中r是回调函数，加载完之后便调用该回调函数

{
      path: '/test',
      component: r => require.ensure([], () => r(require('../components/Test')), 'home')
    },
    {
      path: '/test/test',
      //component: r => { return require.ensure([], () => r(require('../components/Test2')), 'home')}
      component:function (callback) {
         require.ensure([], function(){
          callback(require('../components/Test2'))
        }, 'home')
      }
    }

本质上是这样的形式,r也可以省略:

component: () => require.ensure([], () => require('../components/Test'), 'home')