Vue中模块化和组件的理解 | 您所在的位置:网站首页 › 函数模块化是什么意思 › Vue中模块化和组件的理解 |
最近接触Vue写项目,这是对于Vue中的两个关键的部分我自身的一些理解。希望能对大家有一定的帮助。当然,其中一些描述,可能不太准确,还请大家多多指出错误的地方。🙌🙌🙌🙌 1.1模块化 我们说Vue项目是按照模块进行划分的,那么什么是模块呢? 模块化,就相当于我们网站的导航栏,那么每一个导航项就可以看作是如下图片中提到的 模块化,就好比是一个大的功能项,那么这个大的功能项又可以包含多个组件。 在使用的时候,单个模块对应的是我们Vue项目下compentent下的文件目录 每一个模块下面又可以有多个组件,这些组件又组成了完整的模块页面(单页面) 但是每一个模块下面必须要有一个主要的文件(模块父组件),这个文件必须在路由管理中(router/index.js)进行注册,注册的时候满足以下形式: export default new Router({ mode: 'history', routes: [ { path: '/', name: 'Default', redirect: '/home', component: Home }] }) 其余的组件可以通过以下的方式进行注入使用。在使用的时候,将组件的name属性中的名称在父组件中进行标签化处理(vue会将以驼峰命名的名称进行转化--------(BookManager——>book-manager)) 首先要在用到的页面中的中通过import进行导入其次需要在compent中进行注册,注册的时候会使用组件的name属性进行注入 1.2 组件 什么是组件呢?用一种通俗的方式进行讲解。大家都玩过积木吧?想象一下,我们现在要拼的是一个人物形象。那么现在这个人物就好比是一个模块,而人的四肢、头部等零散的部件就相当于是组件。组件是模块的拆分。是组成一个完整的单页面必不可少的部分。那么我们需要将组件创建出来,然后将它放在合适的位置上,才能最终做出一个完整的人物形象。希望这样讲解能对观看这篇文章的读者有一定的启发。。。✌✌✌ |
CopyRight 2018-2019 实验室设备网 版权所有 |