Eem Jee
Eem Jee

Reputation: 1319

How to properly use v-if and v-else in Vue JS <td> table tags

Since my searches doesn't suffice my issue, I'm posting it here to have some clarification on how to properly use v-if and v-else in <td> tags in HTML table in Vue.

//given the value of this.property is name
<tr>
    <td v-if="this.property == 'name'">I'm name</td>
    <td v-else>No I'm not</td>
</tr>

And my problem is, even though my this.property value is 'name' or NOT a 'name' it always falls to the v-else condition, and v-if is not executed. The output I want is to execute the v-if if the this.property value is 'name' and v-else if not.

Am I doing it the right way? I need your guidance here.

Upvotes: 3

Views: 10357

Answers (1)

Harshal Patil
Harshal Patil

Reputation: 21030

Remove this pointer. You don't need it.

//given the value of this.property is name
<tr>
    <td v-if="property === 'name'">I'm name</td>
    <td v-else>No I'm not</td>
</tr>

Upvotes: 6

Related Questions