Why donate
API Explorer
useMeta composable

The useMeta composable is part of Quasar Meta Plugin. If you haven’t dug into it by now, please have a first read there.

Syntax

For static meta configuration (non-reactive):

import { useMeta } from 'quasar'

setup () {
  useMeta({ /* meta config */ })
}

For dynamic meta configuration (reactive):

import { useMeta } from 'quasar'

setup () {
  // essentially acting as a computed property
  useMeta(() => {
    // compute or reference other stuff
    // in your component
    // then return:
    return { /* meta config */ }
  })
}

Example

<script>
  import { useMeta } from 'quasar'

  export default {
    setup() {
      const title = ref('Some title') // we define the "title" prop

      // NOTICE the parameter here is a function
      // Under the hood, it is converted to a Vue computed prop for reactivity
      useMeta(() => {
        return {
          // whenever "title" from above changes, your meta will automatically update
          title: title.value
        }
      })

      function setAnotherTitle() {
        title.value = 'Another title' // will automatically trigger a Meta update due to the binding
      }

      return {
        setAnotherTitle
      }
    }
  }
</script>