当前位置:   article > 正文

Vue动态加载组件的四种方式_vue动态挂载组件

vue动态挂载组件

动态加载组件的四种方式:

1、使用import导入组件,可以获取到组件

 

  1. var name = 'system';
  2. var myComponent =() => import('../components/' + name + '.vue');
  3. var route={
  4. name:name,
  5. component:myComponent
  6. }

2、使用import导入组件,直接将组件赋值给componet

 

  1. var name = 'system';
  2. var route={
  3. name:name,
  4. component :() => import('../components/' + name + '.vue');
  5. }

3、使用require 导入组件,可以获取到组件

 

  1. var name = 'system';
  2. var myComponent = resolve => require.ensure([], () => resolve(require('../components/' + name + '.vue')));
  3. var route={
  4. name:name,
  5. component:myComponent
  6. }

4、使用require 导入组件,直接将组件赋值给componet

 

  1. var name = 'system';
  2. var route={
  3. name:name,
  4. component(resolve) {
  5. require(['../components/' + name + '.vue'], resolve)
  6. }
  7. }

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/weixin_40725706/article/detail/86258
推荐阅读
相关标签
  

闽ICP备14008679号