#layout

3 messages · Page 1 of 1 (latest)

drifting sail
#

Is there any way to get title and description from useMeta/useHead?

swift raft
#

useMeta don't work in Nuxt 3, useHead and definePageMeta don't return any thing
try use with state and bind with the SEO meta data

const title = useState("title");
//use in useHead and definePageMeta title tag in app.vue pr top level layout 

<script setup lang="ts">
useHead({
  title: title.value,
  meta: [
    { name: 'description', content: 'My site.' }
  ]
})
</script>

// or call in template in Head Tag
<template>
  <div>
    <Head>
      <Title>{{ title }}</Title>
      <Meta name="description" :content="title" />
      <Style type="text/css" children="body { background-color: green; }" />
    </Head>
    <h1>{{ title }}</h1>
  </div>
</template>

you can learn more here
https://nuxt.com/docs/getting-started/seo-meta

Nuxt

Improve your Nuxt app's SEO with powerful head config, composables and components.

velvet surge
#

You can access them via hooks, the issue is that head input isn't resolved until it's rendered, and it's possible for tags to be stripped in the final output