javascript - Vue.JS 使用类作为元素

Question

我尝试为某些课程提供 v-if="seen" 但它显然不起作用......

我的代码：

<div class="item" v-if="seen">item 1</div>
<div class="item" v-if="seen">item 2</div>
<div class="item" v-if="seen">item 3</div>

var item = new Vue({
   el: 'div.item',
   data: {
       seen: true
   }
});

在 JavaScript 中我可以这样做：

var item = document.getElementsByClassName('item');
for(var i = 0; i < item.length; i++){
    item[i].style.display = "none";
}

我必须在 Vue.js 中做什么？谢谢

标签： javascriptvue.jsvuejs2

Answer 1

Vue 的设计方式，理想情况下应该是这样的：

<div id="app">
    <div class="item" v-if="seen">item 1</div>
    <div class="item" v-if="seen">item 2</div>
    <div class="item" v-if="seen">item 3</div>
</div>

var app = new Vue({
   el: '#app',
   data: {
       seen: true
   }
});