vuejs - changing return value inside computed

Question

I use simply computed to get correct values from my array to select field:

computed: {
   specialitySelect() {
   return this.$store.state.physicianListSpeciality
   }
}

this works fine, but I need to get proper values depend on offer.person value, which could be: physician, nurse etc...

How can I change return value to be: in case of nurse:

computed: {
   specialitySelect() {
   return this.$store.state.nurseListSpeciality
   }
}

If this would be a function I could easily do:

methods: {
   specialitySelect(person) {
   return this.$store.state[person]ListSpeciality
   }
}

but in computed I cannot do it. Is there any other solution that I could use instead?

Why not track the current kind of person in a prop in your component? — gnud
– gnud, Commented Apr 24, 2018 at 19:00
@gnud because I want to make some changes within computed before I will send it as a prop — gileneusz
– gileneusz, Commented Apr 24, 2018 at 19:01
Sure - but some part of your app knows the current person. If you somehow share that data with the component that has the computed property, your problem is solved. Where does offer.person come from/live? You're omitting some crucial part of your code here — gnud
– gnud, Commented Apr 24, 2018 at 19:04
offer.person is from data() {return { inside my component. I used this.$store.state.${offer.person}ListSpeciality inside props before and this worked fine — gileneusz
– gileneusz, Commented Apr 24, 2018 at 19:10

Roland · Accepted Answer · 2018-04-24 19:32:33Z

1

One solution would be to check the value of offer.person and depend on that return what you want to return:

 computed: {
   specialitySelect() {
    switch(this.offer.person) {
       case 'nurse':
         return this.$store.state.nurseListSpeciality
         break
       case 'physician':
         return this.$store.state.physicianListSpeciality
         break
       default:
         return []
    }
    return this.$store.state.nurseListSpeciality
   }
 }

Note: Thanks to a comment in this answer a great solution would be:

   computed:{
     specialitySelect() {
        return this.$store.state[this.offer.person + 'ListSpeciality']
     }
   }

edited Apr 24, 2018 at 19:32

answered Apr 24, 2018 at 19:05

Roland

28.1k9 gold badges108 silver badges103 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

gileneusz Over a year ago

This might me an opiton, but I would have to code it for every case of offer.person possible value - and I don't want to do it

gnud Over a year ago

If the naming is always the way you typed it here, you can do this.$store.state[this.offer.person + 'ListSpeciality']. Might be smart to check if this key actually exists in the store, though.

Roland Over a year ago

if the @gnud solution works then great solution @gnud!

Collectives™ on Stack Overflow

vuejs - changing return value inside computed

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest