本文介绍了使用nuxt,如何将路由名称放在页面标题中?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想为每个页面将页面标题设置为不同的值.
I want to set the page title to a different value for each page.
在常规的 Vue.js 中,我做了以下事情:
In regular Vue.js, I have done the following:
import router from './router'
import { store } from './store/store';
router.beforeEach((to, from, next) => {
store.mutations.setRoute(to);
document.title = store.getters.pageTitle;
next();
}
我如何在 nuxt 中获得这种效果?
How would I get that effect in nuxt?
也就是说,在初始页面加载和更改页面时,我希望浏览器选项卡的标题更改.例如,从我的应用 - 关于"到我的应用 - 个人资料".
That is, on both initial page load and when changing pages, I want the browser tab's title to change. For instance, from "My App - About" to "My App - Profile".
推荐答案
来自 nuxt docs,在每个 pages
组件中,您可以定义返回页面标题的 head 函数,即
from nuxt docs, in each pages
component you can define the head function that returns the title of page i.e.
head() {
return {
title: "About page"
};
}
这篇关于使用nuxt,如何将路由名称放在页面标题中?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!