The fact that Vue brings a reactive system provides you with another useful tool — computed properties.
There are cases in which components have some minor data projections, usually implemented as simple properties that depend on underlying data.
To demonstrate computed properties, let's change the Parent component to separate the data called name to both firstName and lastName. The template still binds to name, though. Given that it should be a simple concatenation, it is a good candidate for use with computed properties, as shown in the following example:
<template> <div> <Child @update="changeName" :greet="name" /> </div></template> <script>import Child from './Child.vue'; export default { name: 'Parent', components: { Child, ...