Vue加载组件、动态加载组件的几种方式
发布时间：2020-12-17 02:11:22 所属栏目：百科 来源：网络整理
导读：什么是组件： 组件是Vue.js最强大的功能之一。组件可以扩展HTML元素，封装可重用的代码。在较高层面上，组件是自定义的元素，Vue.js的编译器为它添加特殊功能。在有些情况下，组件也可以是原生HTML元素的形式，以is特性扩展。 下面一段简单的代码给大家介绍V
什么是组件：组件是Vue.js最强大的功能之一。组件可以扩展HTML元素，封装可重用的代码。在较高层面上，组件是自定义的元素，Vue.js的编译器为它添加特殊功能。在有些情况下，组件也可以是原生HTML元素的形式，以is特性扩展。 下面一段简单的代码给大家介绍Vue加载组件的几种方式，具体代码如下所示： 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动态加载组件的四种方式动态加载组件的四种方式：1、使用import导入组件，可以获取到组件 import('../components/' + name + '.vue');
var route={
name:name,component:myComponent
}
2、使用import导入组件，直接将组件赋值给componet import('../components/' + name + '.vue');
}
3、使用require 导入组件，可以获取到组件 require.ensure([],() => resolve(require('../components/' + name + '.vue')));
var route={
name:name,component:myComponent
}
4、使用require 导入组件，直接将组件赋值给componet 总结以上所述是小编给大家介绍的Vue加载组件、动态加载组件的几种方式。编程之家 52php.cn 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |