应用样式于Vue-i18n参数的方法
P粉105971514
P粉105971514 2023-09-11 15:05:24
[Vue.js讨论组]

在模板中有以下翻译:

<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>'
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号