🚀 效率暴增！Vue.js开发必知的15个神级提效工具 开篇：那些年我们浪费的时间 作为一名有五年经验的Vue工程师，我曾无数次在重复劳动中挣扎：手动复制相似的组件代码、在浏览器和编辑器之间反复切换调

在学习 h 函数后，如果你在某些业务场景厌倦使用 Template 的组件编写方式， 完全可以在 Vue 中像 React 那样，以函数式的编程方式来编写组件（不依赖 JSX 插件）。

不管是Vue.js源码，还是UI组件库Element-plus，只要有多人协同开发，代码规范上多多少少都会有一些"百花齐放"。即使像Vue.js源码，不同开发者在命名上也会附带个人风格。

Vue3 中二次封装组件要解决的问题：props 如何穿透出去？slots 如何穿透出去 ？组件的方法如何暴露出去 ？如何让 typescript 类型完备 ？

经验之谈。实际开发的时候，为了减少重复造轮子，提高工作效率，节省开发时间成本，免不了会使用ui组件库，比如在web前端很受欢迎的element-ui。但有的时候，我们需要在原组件的基础上做些改造

在开发 Vue 项目中我们一般使用第三方 UI 组件库进行开发，但是这些组件库提供的组件并不一定满足我们的需求，这时我们可以通过对组件库的组件进行二次封装。

一、动态组件（了解） Vue3已经废除了动态组件，包括Vue2的过滤器也废掉了； 定义： 多个组件 使用 同一个挂载点，并 动态切换； 使用场景： 同一个挂载点 切换 不同组件 显示； 原理： v-i

背景 在某些相对复杂的项目中，我们抽取的公共组件可能存在深层嵌套的场景，例如： 我们会在App.vue里带上业务中提供的数据，一层层的传递进去，在传递的过程中一般有两种方案： 通过props具名接收，

父子组件之间的双向绑定非常简单，但是很多人因为是从Vue 2+开始使用的，可能不知道如何双向绑定，当然最简单的双向绑定（单文件中）就是表单元素的v-model了，例如<input type="text" />它会响应表单元素的value属性，当输入框文本改变时，会将v…