如何显示和隐藏在Vue js中动态创建的div

Question

如何在点击时显示div并在vuejs中隐藏所有其他div？我不知道该计数，因为div将动态生成

Answer 1

您可以在div上使用v-if或v-show，然后让它接受一个评估动态数据的函数，如下所示：

<div v-for="item of items">
   <div v-if="shouldDisplay(item)">{{item}}</div>
</div>
...
methods: {
   shouldDisplay(item){
      if (item...){ //fulfils some condition
           return true
       } else {
       return false
    }

根据@Phils的建议，您还可以将数组创建为可过滤掉所需内容的计算属性：

computed: {
   filteredArray(){
     return items.filter(item => //some condition)
    }