CODEWITHSUNDEEP
vuejs2vue-componentvuetify.jsvue-props
Mariusz
Mariusz

Reputation: 188

VueJS2, how to call props in data

I created a component, I want to call the model value. If I do it the first way, but when I try to do it the second, I get this error.

[Vue warn]: Error in data(): "TypeError: Cannot read properties of undefined (reading 'value')"

The first way

enter image description here

The second way

enter image description here

I want to use second way because i want create own component vuetify date-picker and i want to pass date to him.

Unless it is possible to rewrite the first one in such a way that I can write the date in this way. Is there any way to "vm"? I am using this https://vuetifyjs.com/en/components/date-pickers/#formatting

enter image description here

Thank you for answering

Upvotes: 1

Views: 182

Answers (2)

Mariusz
Mariusz

Reputation: 188

You should use in arrow function like this.

props: ['value'],
data: vm => ({
  props: vm.value
});

Upvotes: 2

IVO GELOV
IVO GELOV

Reputation: 14259

Vue automatically binds the regular functions that are provided to its data or methods sections to the component instance. However, arrow functions can not be bound - the this keyword inside arrow functions refers to the closest outer context/scope. But since there is no such context for the data section - your this is undefined.

You should either use a regular function instead of arrow function when defining your data section - or you should leave the values in the arrow function undefined and assign the initial values inside the created hook.

Upvotes: 2

Related Questions