CODEWITHSUNDEEP
vue.jsecmascript-6vuejs2vuexstate-management
Kris D. J.
Kris D. J.

Reputation: 82

Using join() on array nested in object entries from vuex getter

I cannot get my vuex getter to return errors the way I want it structured.

The structure of my errors object is like this:

errors: {
  email: ['error message.']
  email_confirm: ['error message.', 'another error message.']
}

The structure I want it to be:

errors: {
  email: 'error message',
  email_confirm: 'error message. another error message.'
}

What I have tried so far:

const getters = {
  errors: state => Object.keys(state.errors).map(key => state.errors[key].join(' '))
};

^ This returns the error object values joined, but without the original key of the object.

Any idea of how this can be done? :)

Upvotes: 0

Views: 250

Answers (2)

Borjante
Borjante

Reputation: 10517

A reducer should work for the one liner.

const getters = {
  errors: state => Object.keys(state.errors).reduce((acc, key) => {
    acc[key] = state.errors[key].join(' ')
    return acc
  }, {})
};

Upvotes: 2

Fab
Fab

Reputation: 4657

I don't think it's possible with a single line. You can achieve it in this way:

const getters = {
    errors: (state) => {
       let newErrors = {};
       Object.keys(state.errors).map( key => newErrors[key] = state.errors[key].join(' ') )
       return newErrors;
    }
};

Upvotes: 1

Related Questions