SOURCE

new Vue({
  el: '#app',
  data: {
    color: 'gray',
    width: 100
  },
  computed: {
    myStyle: function(){
      return {
        backgroundColor: this.color,
        width: this.width + 'px'
      };
    }
  }
})

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<div id="app">
  <div class="demo" :style="{backgroundColor: color}"></div>
  <div class="demo" :style="myStyle"></div>
  <!-- 使用数组语法来设置的样式 -->
  <div class="demo" :style="[myStyle,{height: width + 'px'}]"></div>
  <hr>
  <input type="text" v-model="color">
  <input type="text" v-model="width">
</div>

.demo{
  width: 100px;
  height: 100px;
  background-color: gray;
  display: inline-block;
  margin: 10px
}
.red{
  background-color: red;
}
.green{
  background-color: green;
}
.blue{
  background-color: blue;
}