组件外按钮控制菜单折叠

通过组件外的一个按钮控制菜单的折叠,涉及到兄弟组件的传值问题,可以使用的方法有以下几种:

  1. 通过父组件来进行数据传递

  1. 通过vuex或是本地存储进行保存数据,进行传递

  1. 通过eventBus总线传递

这里主要用bus总线传值:

1、首先创建一个新的vue实例

2、需要发送数据的组件A(按钮)

先引入,后发送数据

3、需要接收数据的组件B(导航菜单)

先引入,后接受数据

这样就可以实现组件通信,通过按钮发送数据到导航菜单,来控制菜单的显示隐藏,以及控制导航栏的宽度变化。

这里因为导航菜单放到了el-aside标签里,标签的自带样式导致导航菜单折叠自带的更改宽度的功能失效,需要手动更改导航宽度。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值