computed property shows the array but not the array elements separately

Question

I have a computed property which is---

computed: {
      getGrouped() {
        let ColorwithRate = [];
        this.FilteredColor.forEach((c, index) => {
            c.selectedRate = 0;
            console.log(this.getGrouped[index])
            console.log(this.getGrouped[index].selectedColor)
         ColorwithRate.push(c);
        })

        return ColorwithRate;
      }
   },

the console.log(this.getGrouped[index]) shows an array in console.which is---

But console.log(this.getGrouped[index].selectedColor , it shows --

Cannot read properties of undefined (reading 'selectedColor')

As you said, `this.getGrouped[index]` is returning an array. Then you have to iterate it to access the properties of an object. Try this : `this.getGrouped[index].forEach(obj => { console.log(obj.selectedRate) })` — Debug Diva, Nov 17 '22 at 15:05

blackcityhenry · Answer 1 · 2022-11-17T10:18:14.080

1

I believe you are using Vue3.

What does Proxy mean in the console in Vue 3?

Try console.log(toRaw(this.getGrouped.selectedColor)).

edited Nov 17 '22 at 10:18

answered Nov 17 '22 at 10:02

blackcityhenry

691
1
6
22

showing undefined – 16_018_RHR Nov 17 '22 at 10:14
toRaw is not defined --- this is showing – 16_018_RHR Nov 17 '22 at 11:00

computed property shows the array but not the array elements separately

1 Answers1