首页 > 解决方案 > Nuxt 无法在页面组件中实现 head 功能

问题描述

<template>
    <nuxt />
</template>

<script>
import axios from "axios"
export default {
    name: "index",
    layout: "EwArticle",
    head() {
        return {
            title: this.title
        }
    },
    async asyncData({ params }){
        return axios( `https://restAPI`, {
            method: "GET",
            params: {
                include: params.id
            }
        }).then(response => {
            return {
                title: response.data[0].title.rendered,
                description: response.data[0].excerpt.rendered.replace(/(<([^>]+)>)/gi, ""),
                image: response.data[0].acf["img#1"].sizes["medium_large"]
            }
        });
    }
}
</script>

我上面的代码示例来自嵌套页面组件。asyncData 正在按预期运行,但从未达到 head 函数。我完全糊涂了,因为我不知道为什么在我的所有页面组件上我都无法达到我的 head 功能——即使没有控制台也是如此。有人可以看看吗?

nuxt 配置模式是通用的,我通过 generate 构建我的 nuxt 应用程序。

标签: nuxt.jshead

解决方案


推荐阅读