CODEWITHSUNDEEP
javascriptvue.js
Hax0r
Hax0r

Reputation: 1823

Condition erros in vue.js

I am trying to check my variable is empty. I think my code looks fine. But it is not working..

Current my vue.js version is 2.5.13

Below is my code

<template>
    <div v-if="Object.keys(this.myValues).length === 0">
        is empty
    </div>
    <div v-else>
        good
    </div>
</template>

<script>
export default {
  data: function() {
    return {
      myValues: new Object()
    };
  }
};
</script>

Upvotes: 0

Views: 38

Answers (1)

Niklesh Raut
Niklesh Raut

Reputation: 34914

This is the working example data refers to current template so remove this

var app = new Vue({
  el: '#el',
  data: function() {
    return {
      myValues: new Object(),
      another: {some:'value'}
    }
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.js"></script>
<div id="el">
    <div v-if="Object.keys(myValues).length === 0">
        myValues is empty
    </div>
    <div v-else>
        myValues have some element
    </div>
    
    <div v-if="Object.keys(another).length === 0">
        Another is empty
    </div>
    <div v-else>
        Anoter have some element
    </div>
</div>

Upvotes: 1

Related Questions