https://cn.vuejs.org/v2/guide/components.html
前端模块化开发模式已成主流，但随着前端项目规模的不断扩大，开发者可能会遇到以下一些问题：
在Vue的组件开发中，有些情况组件中的 html 内容是需要通过父组件判断之后，才能有确认的。没有理由对于父组件的判断编写多个存在一定重复代码的组件来进行切换吧！这时候就需要使用到插槽 slot 了。
什么是组件： 组件的出现，就是为了拆分Vue实例的代码量的，能够让我们以不同的组件，来划分不同的功能模块，将来我们需要什么样的功能，就可以去调用对应的组件即可； 组件化和模块化的不同：
在登陆页面的需求中，一般都会有登陆、注册两个按钮，然后点击不同的按钮显示不同的页面。在这里对应的页面可以是一个组件。
本文主要介绍了在Vue中使用的一些常见混淆用法，包括new Vue()、export default {}、createApp()、Vue.component、Vue3注册全局组件、Vue.use()等，以及如何使用混淆器对代码进行加固，保护应用安全。
前面的篇章基本已经说明在webpack中如何构建vue框架的时候。除了这些基础框架的要素，为了快速开发app应用。还要借助于更多的开源组件。
什么是组件： 组件的出现，就是为了拆分Vue实例的代码量的，能够让我们以不同的组件，来划分不同的功能模块，将来我们需要什么样的功能，就可以去调用对应的组件即可； 组件化和模块化的不同： + 模块化： 是从代码逻辑的角度进行划分的；方便代码分层开发，保证每个功能模块的职能单一； + 组件化： 是从UI界面的角度进行划分的；前端的组件化，方便UI组件的重用；
上一篇章，我们讲解了Vue中插槽的基本使用方法，本篇章来讲解作用域查看的情况。这是一种什么情况呢？
上一篇章使用v-if和v-else结合一个flag属性值来控制组件之间的切换。本章节使用components元素来更加直接的切换组件。
对于SPA单页应用，当打包构建时，JavaScript包会变得非常大，影响页面加载速度，将不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这就是路由的懒加载。
把这个store返回出去，那就写完了，核心原理可以说是异常简单。 就用官方文档的案例验证下这个duex有多靠谱：
vue-router 是vue的插件，是对 vue的前端路由管理器，使用中通常分为hash 与 history模式。
概念：html、css、js的集合体，为该集合体命名，用该名字复用html、css与js组成的集合体（复用性）。
按需加载是所有组件库都会提供的一个基础能力，本文会分析ElementUI、Vant及varlet几个组件库的实现并进行相应实践，帮助你彻底搞懂其实现原理。
上一篇使用component元素实现组件切换，但是没有切换的动画效果。那么可以参考官网的例子，实现一下组件切换的动画，以及mode效果设置。
Vue提供了 component ,来展示对应名称的组件 component 是一个占位符, :is 属性,可以用来指定要展示的组件的名称
注意：不能使用npm下载，需要从 github 上下载现成的包并解压，然后拷贝到项目中使用
例如，你可能会有页头、侧边栏、内容区等组件，每个组件又包含了其它的像导航链接、博文之类的组件。
一个页面的ui可以切割成由不同的组件构成，这些组件毕竟独立，这样拆分的好处在于可以做到如同堆积木般快速将页面搭建及重构
原文：intro-to-vue-2-components-props-slots 译者：nzbin 这是关于 JavaScript 框架 Vue.js 五个教程的第二部分。在这一部分，我们将学习组件
组件（Component）是 Vue.js 最强大的功能之一，组件可以扩展 HTML 元素，封装可重用的代码。
使用 Vue.component('组件的名称', 创建出来的组件模板对象) 来定义全局组件，比如Vue.component('myCom1', com1) 使用 Vue.component 定义全局组件的时候，如果组件名称使用了驼峰命名，则在引用组件的时候，需要把大写的驼峰改为小写的字母，同时，两个单词之前，使用 - 连接，比如<my-com1></my-com1> 如果不使用驼峰,则直接拿名称来使用即可，比如Vue.component('mycom1', com1)
考虑一个问题：想要实现 名 和 姓 两个文本框的内容改变，则全名的文本框中的值也跟着改变；（用以前的知识如何实现？？？）
在之前的学习中，我们对于 Vue 的一些基础语法进行了简单的了解，通过之前的代码可以清晰的看出，我们在使用 Vue 的整个过程，最终都是在对 Vue 实例进行的一系列操作。 这里就会引出一个问题，就像我们刚开始学习 C# 的时候把全部的代码一股脑的写到 Main 方法中，现在我们把所有对于 Vue 实例的操作全部写在一块，这必然会导致 这个方法又长又不好理解。 在 C# 的学习过程中，随着不断学习，我们开始将一些相似的业务逻辑进行封装，重用一些代码，从而达到简化的目的。那么，如何在 Vue 中如何实现相似的功能呢？这里就需要提到组件这一概念了，本章，我们就来学习 Vue 中组件的基础知识。
关系：vue构造->vue组件->vue实例 也就是说不同的vue组件可以共用同一个vue构造，不同的vue实例可以共用同一个vue组件
vue-cli 3.0 提供了一系列功能，包括对 Babel, TypeScript, ESlint, PWA 等开箱即用的支持，同时，它也提供了一个 CLI 上的 GUI 界面，你只需输入 vue ui 即可看到配置界面，这里不过多说明，有兴趣的同学，可以参考文档： https://cli.vuejs.org/dev-guide/ui-api.html 。
PrimeVue在npm可用，如果您有现有应用程序，请运行以下命令以将PrimeVue和PrimeIcons下载到您的项目
什么是组件：组件的出现，就是为了拆分Vue实例的代码量的，能够让我们以不同的组件，来划分不同的功能模块，将来我们需要什么样的功能，就可以去调用对应的组件即可；组件化和模块化的不同：
组件是可复用的 Vue 实例，且带有一个名字：在这个例子中是。我们可以在一个通过 new Vue 创建的 Vue 根实例中，把这个组件作为自定义元素来使用：
创建Vue的组件都有三个基本步骤是 【①创建组件构造器、②注册组件和③使用组件】。
之前说过，我们可以通过以下方式创建一个Vue实例 new Vue({ el: '#some-element', // 选项 })
组件系统是Vue.js其中一个重要的概念，它提供了一种抽象，让我们可以使用独立可复用的小组件来构建大型应用，任意类型的应用界面都可以抽象为一个组件树：
Vue推荐在绝大多数情况下使用template来创建你的Html,然而在一些场景中，你真的需要JavaScript的完全编程的能力，这就是、render函数，它比template更接近编译器 使用template例子
组件： 组件是为了拆分Vue实例的代码量的，能够让我们以不同的组件，来划分不同的功能模块，将来我们需要什么样的功能，就可以去调用对应的组件即可； 组件化和模块化区别：
主要从ui界面上进行划分。例如前端的组件化，方便ui组件的调用。类似于以前的导航栏。
低代码平台顾名思义，在开发过程中尽量减少开发人员需要写的代码的数量。对于前端来讲，表现形式主要为配置化及拖拽的形式。
本来还有几个后端知识点要看的,但是我的岗位目前办公处调到上海去了,而且被告知极有可能会做全栈开发...心情复杂... 只能赶紧看看Vue的组件,打包,脚手架问题了. 此去经年只能强大自己,拥抱变化了,上海的毒打会让我更加强壮. 关于本文,我建议如有看到我写的,建议看原版Vue手册,我写的只是整理成我自己最容易理解的方式.
本文我们开始来介绍下Vue中的组件，组件是可复用的 Vue 实例，且带有一个名字。
MVVM源自于经典的MVC（Model-View-Controller）模式。MVVM的核心是ViewModel层，负责转换Model中的数据对象来让数据变得更容易管理和使用。其作用如下：
组件（Component）是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。我们经常会自定义很多组件以满足我们不同的需求。
掘金 | https://juejin.im/user/5a16e1f3f265da43128096cb
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
