Vue v-show

关于vue v-show的一点不得不说的地方。

通常
v-show=“flag” 来判断标签是否显示，data中的flag是boolean值。

but
but
but

如果flag是个数组呢？
业务中不可避免会遇到这种情况。
例如

<template>
	<div>
			<div  @mouseover="showOrHideDiv" style="width:100px;height:100px" v-show="flags[0]">

			</div>
			<div  @mouseover="showOrHideDiv" style="width:100px;height:100px" v-show="flags[1]">

			</div>
			<div  @mouseover="showOrHideDiv" style="width:100px;height:100px" v-show="flags[2]">

			</div>
	</div>
</template>

<script>
export default{
	data(){
		return{
			flags:[
				false,false,false
			],
		}
	},
	methods:{
		showOrHideDiv(a){
			var index = a.target.attributes.l.value;
			this.flags[index].flag=this.flags[index];
			
		}
	}
}
</script>

代码加了点mouseEvent的东西，看不懂没关系，只要知道点击每个div，对应的flags[index],就会改变值，从而引起三个div出现消失，

but
but
but

没有任何反应，为啥？
不知道，我也不知道。。
可能vue留下的bug吧。。。如果又大佬知道原因，麻烦告知。

将flags数组修改成对象就可以了

如下：

flags:[
				{flag:false},
				{flag:false},
				{flag:false},
				
			],


v-show中的flags【x】改成flags[x].flag

不知道为什么只能用数组对象，却不能用一般数组。

如果有用，感谢观看。

                           --来自苦逼的码农