javascript - vuejs如何根据动态数组值显示div？

Question

如果点击了任何用户链接，我想显示/隐藏一个新的 div:

<ul id="pm-tabs"> 
  <li v-for="user in unreadMsgsList">       
     <a @click="openPMbox(user)"> ${user}</a>
  </li>
</ul>

方法是:

    openPMbox: function(user) {              
         this.isPmBoxOpenList[user] = !this.isPmBoxOpenList[user];
    }, 

用户数据存储在 isPmBoxOpenList: [] 中，我可以验证它是否已正确填充。

应该显示/隐藏的窗口是这样的，在上面的v-for循环之外:

<div class="pmbox" v-bind:disabled=="isPmBoxOpenList" >Some Text </div>

但是我在模板中遇到错误。不确定我应该如何定义 pmbox，感谢您的提示。

P.S. 值得一提的是 user 没有在 data 中定义。它只是isPmBoxOpenList 数组中的一个对象。

Answer 1

你可以使用v-if，像这样显示或隐藏:

<div class="pmbox" v-if="isPmBoxOpenList[user]" >Some Text </div>