Javascript Vuejs动态更改填充？

我必须在这里使用滑块，我试图控制div的y填充和x填充，但我一直在试图弄清楚我该如何做

这是一个密码笔

所以基本上滑块分别切换div的y填充和x填充。不确定这是否可以绑定到类，或者这将是一个样式绑定问题

<div id="app">
  <v-app id="inspire">
     <v-container>
        <v-layout row wrap justify-center>
           <v-flex xs12 text-xs-left>
               <div style='border:1px solid black' :class="setPadding">
Humpty Dumpty sat on a wall, humpty dumpty had a great fall.
               </div>
           </v-flex>   
          <v-flex xs12>
          <v-slider
           v-model="yPadding"
            :max="5"
            label="Padding Y"
            ticks="always"
            tick-size="2"
            thumb-label
          ></v-slider>
        </v-flex>
        <v-flex xs12>
          <v-slider
           v-model="xPadding"
            :max="5"
            label="Padding X"
            ticks="always"
            tick-size="2"
            thumb-label
            ></v-slider>
           </v-flex>
         </v-layout> 
      </v-container>
     </v-app>
   </div>

      new Vue({
        el: '#app',
          data() {
               return {
                yPaddingSize: '0',
                ypaddingDirection: 'y',
                xPaddingSize: '0',
                xpaddingDirection: 'x'
            }
           },
        computed: {
       setYPadding() {
      return `$p{this.yPaddingDirection} - ${this.yPadding}px`
        },
      setXPadding() {
      return `$p{this.xPaddingDirection}-${this.xPadding}px`
       },
     setPadding() {
     return this.setYPadding
     return this.setXPadding
      }
    }
  })

汉普蒂·达姆蒂坐在墙上，汉普蒂·达姆蒂摔了一跤。
新Vue({
el:“#应用程序”，
数据（）{
返回{
yPaddingSize:“0”，
ypaddingDirection:'y'，
xPaddingSize:'0'，
xpaddingDirection:'x'
}
},
计算：{
setYPadding（）{
返回`$p{this.yPaddingDirection}-${this.yPadding}px`
},
setXPadding（）{
返回`$p{this.xPaddingDirection}-${this.xPadding}px`
},
setPadding（）{
返回此文件。setYPadding
返回此文件。setXPadding
}
}
})
这是一个示例程序，关键点是
：style



const-app=新的Vue({
el:“#应用程序”，
数据：{
dx:0，
dy:0
},
计算：{
样式（）{
返回{
填充：`${this.dx}px${this.dy}px`，
边框：“1px纯黑”//也可以放在css中
}
}
}
})

{{dx}}/{{dy}
Wow。非常感谢你！！这将是非常有帮助的！！很乐意帮忙：）