CODEWITHSUNDEEP
vue.jsbootstrap-4vuejs2
matt1993
matt1993

Reputation: 49

Vue.js Need to hide values if they dont exist

How do i get v-hide to work. Below is my example.

All I'm trying to achieve is i want the above to hide if value.photo is empty.

<div v-for='value in listPlayers'>

<img v-hide='value.photo.length > 0' src='/wp-content/uploads/2018/10/dummy-copy.gif'>

</div>

Upvotes: 1

Views: 592

Answers (2)

David
David

Reputation: 156

If you don't want to render the element it is better that you use v-if like this:

<div v-for='value in listPlayers'>

   <img v-if='!value.photo.length' src='/wp-content/uploads/2018/10/dummy-copy.gif'>

</div>

You can use v-show also, but with v-show the content will be rendered but not displayed.

Upvotes: 1

Boussadjra Brahim
Boussadjra Brahim

Reputation: 1

You should use v-if or v-show directives and use the negation of your condition :

  v-if='!(value.photo.length > 0)'

Upvotes: 1

Related Questions