Igoohd
Igoohd

Reputation: 166

How to check if an object in MapState is not empty?

I need to check if an object coming from vuex is empty in my Vue component

My component script:

<script>
import { createNamespacedHelpers } from 'vuex'

const { mapState } = createNamespacedHelpers('payments')

export default {

    methods: {
        ...mapState(['bankData']),

        request () {
            if (this.bankData) { //How can I do this condition? 'if (this.bankData)'
                return this.$router.push({ name: 'payment.request' })
            }
            this.$root.$emit('openModal')
        }
    }
}
</script>

The call of my module:

export default new Vuex.Store({
    modules: {
        payments
    }
})

My state in store:

state: () => ({
    bankData: {}
}),

When i do console.log(this.bankData) i receive:

ƒ mappedState () {
      var state = this.$store.state;
      var getters = this.$store.getters;
      if (namespace) {
        var module = getModuleByNamespace(this.$store, 'mapState', namespace);
  …

Upvotes: 0

Views: 642

Answers (1)

Anatoly
Anatoly

Reputation: 22758

mapState should be in computed section and not in methods:

  computed: {
        ...mapState(['bankData']),
  },
  methods: {
    request () {
            // now this.bankData is an object from a state and not a mapState function
            if (this.bankData) {
                return this.$router.push({ name: 'payment.request' })
            }
            this.$root.$emit('openModal')
        }
  }

As for checking an objects is empty or not, for instance, see this answer

Upvotes: 1

Related Questions