点击变色

css代码

<style>
      .select {
        background: #ccc;
      }
    </style>

html代码

<div v-for="i in 10" @click="change(i)" :class="flag==i?'select':''">
        {{i}}
      </div>
      <!-- 点击事件把当前点击的div的下标保存下来，如果这个div是当前点击的就给一个类名select，如果不是当前点击的类名就为空 -->

      <!-- 只要data里的数据发生变化 页面就会重新渲染 -->

js代码

<script src="lib/vue-2.4.0.js"></script>
    <script>
      var vm = new Vue({
        el: "#box",
        data: {
          flag: 0,
        },
        methods: {
          change(i) {
            this.flag = i;
          },
        },
      });
    </script>