Refactoring the copyright component

We will now refactor the copyright component that we already have in the /components/ directory. Let's get started: 

1. Remove the data function from the <script> block in the /components/base-copyright.vue file:

// components/copyright.vue
export default {
  data () {
    return { copyright: '© Lau Tiam Kok' }
  }
}

2. Replace the preceding data function with the props property, as follows:

// components/copyright.vue
export default {
  props: ['copyright']
}

3. Add the copyright data in the <script> block to /layouts/default.vue instead:

// layouts/default.vue
data () {
  return {
    copyright: '© Lau Tiam Kok',
  }
}

4. Remove the existing <Copyright /> component in the <template> block:

// layouts/default.vue
<Copyright />

5. Add a new <Copyright /> component with the copyright data bound to it:

// layouts/default.vue
<Copyright v-bind:copyright...