首页 > 解决方案 > 在vue js组件的类中插入字符串

问题描述

您好,我有一个 vue 组件,我在其中循环访问这样的国家/地区列表:

<div v-for="i in pays" :key="i.id">
  {{i.name}}
  <span class="flag-icon-gr"></span>

我想用我从循环中收到的相应标签更改标志图标的结尾。例如,如果国家是法国,我想拥有 flag-icon-fr。有没有合适的方法来做到这一点?

ps:我使用的是 nuxt,但我想它对于普通的 vue js 组件是一样的。

标签: cssvue.jsnuxt.js

解决方案


您可以使用以下方式动态绑定类:

<span :class=:icon="'fa-flag' + i.name"></span>

推荐阅读