Often, components need to manage data. In addition to props, which are passed-in immutable input, you can specify mutable component data similar to React's concept of state, as well as props.
Data can be specified as a plain object or a factory function that creates that object. Let's use the latter to rewrite the parent component to bind to mutable data, as shown in the following example:
<template> <div> <Child :greet="name" /> </div></template> <script>import Child from './Child.vue'; export default { name: 'Parent', components: { Child, }, data: () => ({ name: 'John Doe', }),}</script>
Now the parent component binds the greet property to a data entry that can now be mutated as part of this component logic. Next, you will complete ...