How To Use Props in Vue

Properties, often just called "props" are an important part of Vue, and are a key way we pass data to child components. In this guide, we'll be going over how to use props, and why we use them. The focus of this guide is Vue 3, although much of what is written is applicable to Vue 2 as well.

Properties or Props in Vue

One of the fundamental principles we use when building in many frontend frameworks like Vue, is that new pieces of functionality are usually built as components. For example, we may build a 'most popular' component, which looks something like this: