Vue-使用element-resize-detector监听元素大小变化

1.应用

 底部固定按钮栏使用 position: fixed 固定定位,宽度等于右侧内容栏的宽度,当我们左侧菜单栏收起的时候,其宽度也能够自适应变化。也就是说底部栏的宽度需要监听其父元素右侧内容的宽度从而实现自适应变化。

2、 解决方法:使用 element-resize-detector

(1)下载

npm i element-resize-detector --save


(2)导入

const elementResizeDetectorMaker = require('element-resize-detector')


(3)使用

// 监听右侧page元素宽度变化,更新底部固定按钮栏宽度
let erd = elementResizeDetectorMaker();
erd.listenTo(document.getElementById('id元素'), (ele) => {
    console.log(ele.clientWidth);
})

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值