Vue2 v-show validate empty strings in a loop

Question

How do I validate inside of a loop with v-show empty items with vuejs2. I was trying the following but without any results

<div v-for="user in $store.state.users.data">
   <ul>
       <li v-show="user.mobil !== null ||  user.mobil !== ''" >
              <a v-bind:href="'tel://' + user.mobil"> <i class="fa fa-mobile-phone"></i> <span>{{ user.mobil }} </span></a>
       </li>
   </ul>
</div>

$store.state.users.data is an array of objects fetched from server — fefe
– fefe, Commented Jun 6, 2018 at 11:54
Can you make an example array with 2,3 of those objects with same structure? — Vucko
– Vucko, Commented Jun 6, 2018 at 11:56

Vucko · Accepted Answer · 2018-06-06 12:03:43Z

1

Compare like v-show="user.mobil":

new Vue({
  el: '#app',
  data: {
    users: [{
        mobil: '123',
        name: 'Foo'
      },
      {
        mobil: '',
        name: 'Bar'
      },
      {
        mobil: null,
        name: 'Baz'
      },
    ]
  }
})

<script src="https://unpkg.com/vue"></script>

<div id="app">
  <div v-for="user in users">
    <ul>
      <li v-show="user.mobil">
        {{user.name}}
      </li>
    </ul>
  </div>
</div>

How do you check for an empty string in JavaScript?

answered Jun 6, 2018 at 12:03

Vucko

20.9k12 gold badges60 silver badges108 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Vue2 v-show validate empty strings in a loop

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related