Creating dynamic data using computed properties

In the previous section, we learned how to simplify our component by abstracting the logic of our click events. We are going to continue on the subject of “refactoring” and introduce a new feature called computed properties.

When people first learn about computed properties, they usually compare them to methods due to their similarities, but in reality, this feature is more closely related to props and Ref than methods.

Computed properties can be described as follows:

Computed properties enable you to create a dynamic property that can be used to modify, manipulate, and display your component data (refs, reactive, and properties). - https://blog.logrocket.com/

So far, we have used Ref, Reactive, and props to pass and display data within our application, but there are times when the data received may need to be formatted, or when we need to create new data altogether.

When the need for dynamic properties arises...