Why Am I getting error return in computed property?

Question

I'm using Vuex, inside Getter Foo function I'm returning two values inside array:

return ["Try Again"] or return ["Data result", data], in computed, I'm checking the array length and returning depending on result

  computed:{    
    Foo: function(){
      const getFoo =  this.$store.getters.Foo;
      if(getFoo.length === 1) {
        this.existFoo = false
        return getFoo[0]
      }
      this.existFoo = true
      return getFoo
    }
  }

but I'm getting this error, even reading others posts I cannot solve it

34:9 error Unexpected side effect in "Foo" computed property vue/no-side-effects-in-computed-properties
37:7 error Unexpected side effect in "Foo" computed property vue/no-side-effects-in-computed-properties

Answer 1

You could use a watcher to watch the store value and set your local variables.

computed: {
  getFooFromStore() {
    return this.$store.getters.Foo
  }
}

watch: {
  getFooFromStore: function() {
    this.existFoo = this.getFooFromStore[0] ? false : true;
  }
}