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, Jun 06 '18 at 11:54
Can you make an example array with 2,3 of those objects with same structure? — Vucko, Jun 06 '18 at 11:56

score 1 · Accepted Answer · answered Jun 06 '18 at 12:03

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?

Vue2 v-show validate empty strings in a loop

1 Answers1