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应该是一样的效果，我这个还没试，有其他解决办法的道友可以在评论区交流，有大神指点这个问题的原理那更是欢迎~
