Bootstrap-Vue <b-card>带标题链接

时间:2018-03-14 15:02:16

标签: vuejs2 vue-component bootstrap-vue

我有一个包含<b-card>组件的组件,如下所示:

<b-card :title="post.title">
  <p class="card-text">{{ post.body }}</p>
</b-card>

如何将卡片标题设为可点击链接?也就是说,我可以使用:title=设置文本,但不存在用于将文本包装在<a href="">标记中的参数。

1 个答案:

答案 0 :(得分:5)

您可以使用title选项停用sub-titleno-body的呈现。然后,你可以自己实现身体。

<b-card no-body>
  <b-card-body>
    <b-link to="/">
      <h4>{{ post.title }}</h4>
    </b-link>
    <p class="card-text">{{ post.body }}</p>
  </b-card-body>
</b-card>