在 vuetify v-btn 中正确使用分组棱镜 link 字段？

Question

我有一个棱柱群 (link_sections)，其中包含一堆字段。其中一个字段是 link，因为我使用这些组创建的标记应该包含站点其他地方的 links 按钮。问题是我不知道如何在此上下文中正确使用 prismic links 因为据我所知不可能将 link 数据绑定到 v-btn 之类的内部所以...

<v-layout v-for="(section, index) in fields.link_sections" :key="index">
  <h2>{{section.header}}</h2>
  <v-btn router-link :to="{{section.link}}"></v-btn>
</v-layout>

如果我只是在 v-btn 元素之外呈现 {{section.link}} 我可以成功呈现 link 的文本值，但我已经尽力了做，显然我想将文本用作实际 link。任何人都知道如何使棱柱群中的 link 字段与 v-btn 元素一起使用？

Answer 1

你的语法有误，试试这个片段： <v-btn :to="section.link">Link</v-btn>。另外 <b-btn></v-btn> 没有 router-link 道具。只需传递道具 to。如果您传递 to 属性，则意味着您希望该按钮成为 <router-link>

Denotes the target route of the link.

在 vuetify v-btn 中正确使用分组棱镜 link 字段？

Using grouped prismic link fields in a vuetify v-btn properly?

hyperlink

vue.js

prismic.io

vuetify.js