<div id="root">
	<!-- 绑定class样式-字符串写法，适用于：样式得类名不确定，需要动态指定 -->
	<div class="basic" :class="mode" @click="changemode">{{name}}</div>
	<!-- 绑定class样式-数组写法，适用于：要绑定得样式个数不确定，名字也不确定 -->
	<div class="basic" :class="classarr">{{name}}</div>
	<!-- 绑定class样式-对象写法，适用于：要绑定得样式个数确定，名字也确定，但要动态决定用不用 -->
	<div class="basic" :class="classobj">{{name}}</div>
</div>

new Vue({
	el:"#root"
	data:{
		name:"小恶魔",
		mode:"normal",
		classarr:['atguigu1','atguigu2','atguigu3']，
		classobj:{
			atguigu1:false,
			atguigu1:false
		}
	},
	methods:{
		changemode(){
			var arr = ['happy','sad','normal']
			this.mode = arr[Math.floor(Math.random()*3)]
		}
	}
})

补充知识

.shift()：移掉数组中得第一个元素