vue-meta
vue-meta copied to clipboard
Vue 3: `titleTemplate` no longer working
Working in Vue 3 with the options API and vue-meta 3.0.0-alpha.10.
It seems there's no longer a way to set a titleTemplate?
Any other ideas on how to do nested routes with nested title? Example: Start Page: 'Application Name' Module Page: 'Module Name - Application Name' Everything inside the module: 'Page Name - Module Name - Application Name'
<metainfo>
<template v-slot:title="{ content, metainfo }">
{{
metainfo.titleTemplate
? metainfo.titleTemplate.replace('%s', content)
: content
}}
</template>
</metainfo>
works for me
then, you can use it in vue3 just like vue2
in <script setup>
// with titleTemplate
import { useMeta } from 'vue-meta';
useMeta({
title: 'Nuxt',
titleTemplate: '%s - A SSR JavaScript Framework',
});
// without titleTemplate
import { useMeta } from 'vue-meta';
useMeta({
title: 'Nuxt',
titleTemplate: false,
});
@DengSihan Yes and No.
Because all meta stuff gets injected into the ~~dom~~ the document so you end up with:
<titletemplate>%s - Level in between - Our Application</titletemplate>
Which is not optimal?
For anybody showing up later searching, this project is no longer maintained ( https://github.com/nuxt/vue-meta/issues/808 ) and suggest looking at using something like https://github.com/unjs/unhead/