CODEWITHSUNDEEP
vue.jslaravel-5.3vuejs2vue-componentvuex
samuel toh
samuel toh

Reputation: 7076

How can I use if in if on vue.js 2?

If in view blade, it's like this :

<ul>
@if ($a)
    @if (!$b)
        <li>
            <p>...</p>
            ...
        </li>
    @endif
@endif
...
</ul>

I want change it to be vue component

I try like this :

<ul>
<li v-if="a" v-if="!b">
    <p>...</p>
    ...
</li>
...
</ul>

Seems it's wrong

How can I do it correctly?

Upvotes: 0

Views: 132

Answers (1)

Frnak
Frnak

Reputation: 6802

You have multiple options either you chain the condition as described by @Amresh Venupogal or you make a nested if just like you did in your bladeview. However it would require you to add an additional html element.

Option A

<ul> 
  <li v-if="a && !b"><p>...</p></li>
</ul>

Option B (obviously worse since you will create empty div's inside your unorderd list)

<ul> 
  <div v-if="a">
     <li v-if="!b"><p>...</p></li>
  </div>
</ul>

Upvotes: 1

Related Questions