Vue how to assign prop data to arraylist

Question

In my vue-application I want to assign prop data to an arraylist.

<MyComponent :mydata="someArrayData" />

In "MyComponent" I want to do this:

props: {
   mydata: {
      type: Array,
      default: []
   }
}
data(){
   arrayList: []
}
created(){
   this.arrayList = this.$props.mydata;
}

but then "this.arrayList" is empty - when I do console.log(this.$props.mydata) it returns the data.

what am I doing wrong here?

Isn't there an error in the console telling you "data functions should return an object"? Your data function doesn't return anything — Dan
– Dan, Commented Jan 27, 2021 at 10:56

ST80 · Accepted Answer · 2021-01-27 10:58:51Z

1

I actually managed to solve it by simply adding:

<div v-if="someArrayData.length">
   <MyComponent :mydata="someArrayData" />
</div>

now it works for me!

Thanks for the help anyway!

answered Jan 27, 2021 at 10:58

ST80

3,94319 gold badges73 silver badges149 bronze badges

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

Comments

Gert B. · Accepted Answer · 2021-01-27 10:44:58Z

0

you do not need 'this' in the data properties:

props: {
   mydata: {
      type: Array,
      default: []
   }
}
data(){
   arrayList: []
}
created(){
   this.arrayList = this.$props.mydata;
}

answered Jan 27, 2021 at 10:44

Gert B.

2,34720 silver badges22 bronze badges

ah sorry, my bad - I actually didnt have "this" in the data properties - updated my question.