vue如何实现对象或数组数据的绑定

Question

<div id="app">    <div v-for="item in count" v-bind:class="arr">{{ item }}</div></div><script src="vue.js"></script><script>    var vm = new Vue( {        el: "#app",        data: {            count: 100,            arr: []        }    } );</script>我想做的是通过对100个div的class进行数组数据的绑定，这样我就可以通过一个数组来控制对应的div的class了那该如何实现这样的需求呢？例如实现如下的需求：<div id="app"><div v-for="(item,i) in count" v-bind:class="arr[i]" v-bind:index="i" v-on:click="divClick">{{ item }}</div></div><script src="vue.js"></script><script>    var vm = new Vue( {        el: "#app",        data: {            count: 100,            arr: []        },        methods: {            divClick: function( e ) {                this.arr[ e.target.getAttribute( "index" ) ] = "active";                console.log( this.arr );            }        }    } );</script>当点击一个div时，为该div添加一个“active”样式，保证只有当前被点击的div会添加actve样式，其他的不会变，因此这里才会想到数组和对象作为数据。

Answer 1

<div v-for="(item,i) in count" v-bind:class="arr.join(' ')">{{ item }}</div>

Answer 2

<div v-for="(item,i) in count" v-bind:class="arr[i]">{{ item }}</div>