Computed

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, ...

Get Hands-On Full-Stack Web Development with ASP.NET Core now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.