[Vuejs]-NuxtJS – Set head title/description on mounted?

6πŸ‘

βœ…

From the head documentation, type is Object or Function

So if you reformat your code a bit, you could write head like this

head() {
  const thread = threads.find(t => t.id === this.$route.params.id)

  return {
    title: thread ? thread.title : '',
    meta: [
      {
        hid: 'description',
        name: 'description',
        content: thread ? thread.body : ''
      }
    ]
  }
},
πŸ‘€ljubadr

0πŸ‘

You should define thread in data method

data () {
  return {
    thread: {
      body: '',
    }
  }
}

Also, the head should be define as method, not a property.

head () {
  return {
    meta: [
      {
        hid: 'description',
        name: 'description',
        content: this.thread.body
      }
    ]
  }
}
πŸ‘€Cong Nguyen

0πŸ‘

aznable Apparently you must remove null from here

thread: null => thread: ""

and insert this inside async methods

   async getId() {
    this.thread = await threads.find(t => t.id === this.$route.params.id)
   }

Best !

πŸ‘€Birante

Leave a comment