Vue和uniapp中v-if绑定数组中的布尔值没有效果

标题Vue和uniapp中v-if绑定数组中的布尔值没有效果

1、实际场景

(1)js代码里

data(){
	list:[true,false]
}

(2)页面中

<div>
	<div v-if='list[0]'>我应该显示<div>
	<div v-if='list[1]'>我应该隐藏</div>
</div>

(3)实际结果
实际是两个Div都是隐藏的，

2、解决办法

在vue项目和uniapp项目中都是一样的结果，目前还不知道原理是啥，但有一个解决办法：
那就是把绑定的数组的数据类型改为对象的形式，如下所示：

(1)js代码里

data(){
	list:[{type:true},{type:false}]
}

(2)页面中

<div>
	<div v-if='list[0].type'>我应该显示<div>
	<div v-if='list[1].type'>我应该隐藏</div>
</div> 

3、总结

使用vue的v-if时需要注意一下绑定的数据是否和数组有关，如果是，则需要将数组里面的布尔值加个属性来控制，避免绑定失效，对于v-show应该是一样的效果，我这个还没试，有其他解决办法的道友可以在评论区交流，有大神指点这个问题的原理那更是欢迎~