How do I execute some method each time the size (width or height) of a div changes?
<template>
<div>
</div>
</template>
<script>
export default {
methods: {
redraw() {
// ...
}
}
}
</script>
You could define width and height on data dynamically and then make a watch on these sizes. Something like this:
UPDATE The comment of Lawrence Cherone made me realize an error I made here.
<template>
<div :style="{width: divWidth, height: divHeight}">
</div>
</template>
<script>
export default {
data():{
return {
divWidth: '100px',
divHeight: '100px'
}
},
watch: {
divWidth (newVal){
if(newVal){
this.redraw()
}
},
divHeight (newVal){
if(newVal){
this.redraw()
}
},
methods: {
redraw() {
// ...
}
}
}
</script>