CODEWITHSUNDEEP
vue.jsvuejs2vue-component
Roman Chasovitin
Roman Chasovitin

Reputation: 78

How to use props in Vue correctly?

My colleague and I have an interesting question. He calls to use props in a component via this.$props[propName], but I call to use props simply via this[propName]. I haven't found any mention of using $props in Vue documentation (I don't know, maybe I'm not looking hard enough), so my way seems more correct to me. My colleague thinks that using $props is the more obvious way to immediately understand whether it's prop or data. Which of us is right?

Stack: Javascript + Vue2 + Nuxt

Upvotes: 1

Views: 259

Answers (1)

ElizabethSetton
ElizabethSetton

Reputation: 379

I understand your colleague that using this.$props[propName] is more understandable that this value is coming from props and you can't mutate it. But this way is more open to bugs because there is no autocomplete on the prop name, it's just a string that any developer can make a mistake and the IDE will not correct them. When using this.propName you will get autocomplete and if you still make a mistake the IDE will warn you.

Note: When running vue app and you mutate a prop you get an error in the console, so I think you are pretty safe using this.propName

Upvotes: 4

Related Questions