Understanding prop types and validation
We use props to define the interfaces of Vue components and ensure other developers use our components correctly. We need to define their interfaces with types and validation. Vue offers that capability out of the box by changing how we pass the props as string elements to the props
property in an object form.
Primitive prop validation
Assume we want a Repeat.vue
component that takes a times
prop and a content
prop and then calculates the array of repetitions
using computed
based on the times
value. We can define the following:
<template> <div> <span v-for="r in repetitions" :key="r"> {{ content }} </span> </div> </template> <script> export default { props: ['times', 'content'], computed: { repetitions...