How to implement computed properties in Vue.js?

Computed properties are properties in a Vue.js component that are calculated based on other properties in the component. They are like methods, but they are cached based on their dependencies, and will only re-evaluate when one of their dependencies changes. This can be more efficient than calling a method multiple times, especially if the method's result is expensive to compute.

Example:

<template>
 <div>
    <p>{{ reversedMessage }} </p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: 'Hello world!'
    }
  },
  computed: {
    reversedMessage() {
      return this.message.split('').reverse().join('')
    }
  }
}
</script>