应用样式于Vue-i18n参数的方法
P粉105971514
P粉105971514 2023-09-11 15:05:24
0
1
623

在模板中有以下翻译:

<p>
{{ $t('计数器:{n}', {n: counter}) }}
</p>

其中counter只是从脚本返回的一个数字,我想给“n”应用一个样式(例如,使其变红)。

我该如何实现这个目标?

P粉105971514
P粉105971514

全部回复(1)
P粉511749537

一种方法是直接在翻译中添加HTML代码。这将使计数器始终以红色显示:

翻译:

counter: '计数器为:<span style="color: red">{n}</span>'

模板:

<span v-html="$t('counter', {n: 22})" />

如果您希望颜色更加灵活,可以添加额外的参数:

<span v-html="$t('counter', {n: 22, color: 'green'})" />
counter: '计数器为:<span style="color: {color}">{n}</span>'
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板