Vue动态设置Dom元素宽高

需求：

slider侧边栏是宽度是动态的，使用jquery可以操作dom元素，设置宽高，但vue是避免操作dom的

<template>
    <div class="slider">
        <h1>Hamy</h1>
    </div>
</template>

<script>
    export default{
        name:'index',
        data(){
            return{
                sliderStyle:{
                    width:'240px'
                }
            }
        }
    }
</script>

思路：

通过给元素绑定style,在methods中通过改变this.sliderStyle.width来设置动态宽度

<template>
    <div class="slider" :style="sliderStyle">
        <h1>Hamy</h1>
    </div>
</template>