qczzc的博客

提示：需要大家熟悉css中的定位position以及v-model的基础原理。提示：以下是本篇文章正文内容，下面案例可供参考需要熟练掌握 css 、vue计算属性 、v-model的原理欢迎小伙伴们留言讨论，也欢迎大佬😎。

抽屉打开的方向有 上下左右 4种左边打开右边打开下面打开上面打开省略（不清楚的小伙伴可以看我的 手把手教你封装按钮组件 的准备工作和这个差不多）2、编写上下左右的基础样式3、定义props动态绑定drawer样式4、给drawer打开加入动态效果这里我们采用 css3 的方式，当然也可以用 js 控制5、给drawer加入插槽6、使用组件drawer四、完整代码1、drawer总结1、主要还是组件之间的通信（不熟悉的小伙伴欢迎评论留言 我会单独出一期组件之间的通

封装一个简单地按钮组件

例如：随着业务功能模块的增加，动态导航栏的封住就显得格外中要。使用for循环遍历barList(可从后台请求)通过点击实现对应模块的字体高亮以及下划线。