时间戳

首页 > 解决方案 > 在组件中使用时 Nuxt 内容热重载 yaml 文件

javascript - 在组件中使用时 Nuxt 内容热重载 yaml 文件

问题描述

我在组件文件夹中有一个ListProjects.vue 。

ul
    li(v-for="project in projects", :key="project.title")
        a(:href="project.url") {{ project.title }}

我在内容文件夹中也有projects.yaml

list:
- title: Project 1
  url: https://www.project1.com
- title: Project 2
  url: https://www.project2.com

如果我在我的 index.vue 页面上获取 projects.yaml 的内容并作为道具传递给 ListProjects.vue，那么当我更新 projects.yaml 时热重载会起作用

ListProjects(:projects="projects.list")

但是，如果我只是在我的索引上引用 ListProjects，并且在 ListProjects.vue 中获取内容，那么热重载将不起作用。

在这两种情况下，我都以这种方式获取内容：

export default {
    data() {
        return {
            projects: [],
        }
    },
    async fetch() {
        this.projects = await this.$content('projects').fetch()
    }
}

问题

是否可以仅通过获取组件内的内容来使 hrm 工作？

标签： javascriptvue.jsyamlnuxt.jsnuxt-content

解决方案

推荐阅读