0

我正在与Lucie Habere 一起创建一个带有 Vue Router 和 Prismic 的食谱网站。我遇到的问题是我的index.vue页面上的prismic-link组件没有为 vue 路由器生成锚标签href字段。

在查看开发工具时，我看到在我的响应中，结果对象url字段为空白，而在示例站点页面上，它返回页面的相对路径：

(i.e. url "/recipes/gluten-free-oat-dumplings").

因此，显然 prismic-link 生成的锚标签具有href=""属性值。我认为这就是问题所在。

我还注意到我对 Prismic 的初始查询不包括查询参数：

(https://mybestrecipes.cdn.prismic.io/api/v2/documents/search?ref=YWhMghIAAElp5kmP&q=[[at(document.type, "recipe")]]&pageSize=100)

而露西的例子确实

(https://the-last-straw.cdn.prismic.io/api/v2/documents/search?ref=YRv4vBIAAB8AWKJm&q=[[at(document.type, "recipes")]]&routes=[{"type":"home","path":"/"},{"type":"recipes","path":"/recipes/:uid"}]&pageSize=100).

我还在 vue.config.js 文件中添加了“runtimeCompiler :true我的棱镜.js：

import { createPrismic } from "@prismicio/vue";

const prismic = createPrismic({
  endpoint: "mybestrecipes",
  clientConfig: {
    defaultParams: {
      routes: [
        { type: "home", path: "/" },
        { type: "recipe", path: "/recipe/:uid" },
      ],
    },
  },
});

export default prismic;

以下是来自 devtools 的一些快照：

网址=

标签

标头

巧合的是，我克隆了她的仓库并发生了同样的问题。然而演示站点工作正常。

任何有助于理顺这一点的帮助表示赞赏。

4

1 回答 1

3

露西来啦~

事实上，在 Alex 的直播中，我们使用了套件的 alpha 版本。我们已经发布了对底层客户端工具包的一些重大更改（因为我们处于 alpha 阶段）：routes参数不再嵌套在 下defaultParams，您现在应该可以使用这样的东西了：

import { createPrismic } from "@prismicio/vue";

const prismic = createPrismic({
  endpoint: "mybestrecipes",
  clientConfig: {
    routes: [
      { type: "home", path: "/" },
      { type: "recipe", path: "/recipe/:uid" },
    ],
  },
});

export default prismic;

现场演示仍在工作，因为仍在使用旧版本的套件 :relaxed: 我将在本周晚些时候更新它！

让我们知道有什么！

于 2021-10-19T15:09:42.593 回答