I want to dynamically show elements from an array based on boolean values. However, I am facing an issue where the element does not disappear even after the boolean value changes.
<li v-for="(value, index) in list">
<span> {{ value[0] }} </span>
<span v-if='value[1]'> {{ value[2] }} </span>
</li>
var List = new Vue({
el: "#List",
data: {
list: ['fizz', true, 0],
},
methods: {
toggleItem: function(index) {
this.list[index][1] = !this.list[index][1];
},
}
})
To test the functionality, I can run:
List.toggleItem(0)