[Vuejs]-Is it possible to not calculate computed property before "ready" in Vuejs?

by

0👍

✅

You could try something like this:

new Vue({
  el: '#demo',
  data: {
    numbers: []
  },
  ready () {
    // simulate an ajax call
    setTimeout(() => {
      this.numbers = [1, 2, 3, 4, 5]
    }, 2000)
  },
  computed: {
    sum () {
      // before the ajax response, returns 0
      if (this.numbers.length === 0) {
        return 0
      }
      // after the ajax response, returns the sum
      return this.numbers.reduce((prev, curr) => {
        return prev + curr;
      })
    }
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.24/vue.min.js"></script>

<div id="demo">
  {{ sum }}
</div>

Leave a comment