vue中如何实现样式之间的动态切换

在原生或者jQuery中，通过直接操作DOM来进行样式的渲染。

那么在Vue中也要获取dom节点进行操作吗？！

当然不需要！我们可以很方便的通过动态css判断进行渲染，下面是一个案例：

<template>
  <div class="hello">
    <ul>
      <li 
      v-for="(list, index) in list"
      :class="{'active':cla === index}"
      @click="changeBg(index)">{{list}}</li>
    </ul>
  </div>
</template>

 data () {
    return {
      list: ['列表1', '列表2', '列表3', '列表4'],
      cla: ''
    }
  },
  methods: {
    changeBg: function (index) {
      this.cla = index
    }
  }

通过点击事件将v-class动态绑定！完美的解决需求