Vuejs Condition of Classes

Asked

Viewed 164 times

1

I have a menu and wanted to know if there is a way I make a condition of add a class depending on the child class.

For example:

<ul :class="{ 'open' : TemClasseNoFilho }">
    <li v-for="item in list" :class="{ 'active' : $route.nome == item.rotaNome}">
          <a>{{ item.nome}}</a>
    </li>
</ul>

In this example, I would like to set the condition: "Enter class "Open" in "ul" if the "li" have the class "active"

Thank you!

javascript vue.js

  • just create on the date, and make it true or false, Then go check, if it is true, it exists, if it is false nay

  • What do you mean, Rafael?

1 answer

1

Creates a die in the computed kind of: 

isOpen: function() {
  if (this.$els.li.className.match(/\active\b/)) {
    return true;
  }
}

and in the template:

<ul :class="isOpen ? 'open': ''">
    <li v-for="item in list" :class="{ 'active' : $route.nome == item.rotaNome}">
          <a>{{ item.nome}}</a>
    </li>
</ul>

Browser other questions tagged javascript vue.js

You are not signed in. Login or sign up in order to post.