IT小书童 - 为程序员提供优质教程和文档

vue3 父组件调用子组件的方法是通过 expose 和 ref 来实现的，我们可以通过 expose 来控制父组件可以访问子组件那些的方法和对象。

开发好组件后，我们需要使用组件就需要注册组件，我们可以根据自己的使用情况进行局部注册组件、全局注册组件、自动注册组件。

vue3 组件的生命周期包含创建、挂载、激活、卸载等周期，就好比人生一样出生、上学、工作，vue3的生命周期和vue3有一些命名不一样，我们将之对比。

vue3 通过 expose 可以使外部访问组件内部对象或方法，就是我们使用一个组件时有时需要直接访问这个组件的对象或方法，在options api(选项式)默认当前实例是全部暴露的，而setup(组合式)默认是封闭的。

我们通过 props 属性可以把数据传给组件，而通过 provide 与 inject 我们可以把数据传递给N个层级的子组件，比如A组件用了B组件，B组件用了C组件，它可以把组件直接从A传给C组件。

v-model 是 vue3 的一个内置指令，可以实现父组件变量(不能是常量)与子组件属性的双向绑定，我们在很多知名的开源库可以看到这个命令,比如我们要实现一个弹窗组件需要父组件和子组件都可以操作这个变量来实现隐藏显示统一步调。

vue3 slots 插槽是组件开发者预留给调用者自由发挥的区域，比如我们一个网页的顶部栏和左边菜单栏是固定而中区域需要显示不同的内容，这时插槽就实现了模板的复用，插槽具有匿名插槽和具名插槽。

事件是组件开发中必不可少的部分，事件就是当你完成了某个任务后你把这个事情告诉别人的动作，比如你在组件中保存成功了数据等等，本文将介绍任何在vue3中定义事件以及调用者任何接收这个事件。

vue3 通过 props 来定义属性，我们可以通过属性将值传给自定义组件，比如颜色、高度宽度等等，定义属性时我们也可以定义类型和默认值。

在手机中或web端复制粘贴是一个常用的功能，可以帮助用户方便的复制需要的内容，比如字符串或图片，本文将介绍在vue2 中使用 clipboard.js 复制功能。

clipboard.js 也可以复制图片到微信和word，复制到微信不能是https和base64格式，但是word、excel支持。

clipboard.js 方法高级使用方法,如果你不喜欢像之前一样设置html的属性来实现复制，clipboardjs 通过了api方式实现更佳自由的方式来实现复制功能。

clipboardjs 通过 html5 data标签属性实现粘贴复制,优点是简单无需写过多的代码。

vue.draggable.next 的 sort 字面意思我们也可以看出来是否允许进行排序否能，注意这里只是否允许排，而不是不能进行拖拽，通过我们的在线demo你就一眼可以看出他的作用。

vue.draggable.next 的 group 属性可以实现分组拖拽，比如A和B区间相互拖拽，也可以实现A允许拖入B，但是B不允许拖入A区域。

我们可以使用vue.draggable.next对普通表格table的行与列进行拖拽，如果是新的项目建议使用ag-grid来制作表格，如果是老项目使用的 html 普通table又需要拖拽功能，那么可以参考本章的内容进行开发。

本文将模拟 vue.draggable vue3 版本在工作台中的应用场景，假设工作台分为3列用户可以自由拖拽任何一列，但是消息通知模块不允许拖拽和停靠只能在第一列的最顶部。

vue-qr一款可以生成带logo和背景图片二维码的vue前端插件，功能强大但使用简单，你可以使用该插件生成各种漂亮的二维码图片。

vue-qrcode一款前端生成二维码的vue组件，支持ie10及以上ie浏览器和现代浏览器。vue-qrcode支持设置二维码大小、间距、qrcode版本、前景色背景色和指定渲染成svg或图片等，也可以导出图片和数据功能强大。

BootstrapVue Calendar组件提供了输入、选择、上下文事件，我们可以通过这些事件结合自己的业务进行相应的处理,如果设置了disabled或readonly属性那么不会触发事件。