css - 在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 组件是一样的。
解决方案
您可以使用以下方式动态绑定类:
<span :class=:icon="'fa-flag' + i.name"></span>
推荐阅读
- css - ng-deep 正在影响兄弟组件
- ios - 关于属性值 iOS/Swift 的 UI 测试
- powershell - 使用 powershell 为特定机器/用户共享文件夹
- javascript - 使用 Qlik 扩展导出整个 Qlik 报表
- swift - 音频在模拟器中播放,但不在设备上
- python - 从 qml 获取委托 objectName 到 python
- xslt - 动态生成 kml 时的命名空间问题
- python - Python如何检查脚本是否已经结束
- excel - 如何在多个 Excel 文件中共享重复代码?
- excel - VBA选择透视报告过滤器中大于/小于数字的所有项目