如何在nuxt-i18n中添加CSS样式？

Question

我有以下翻译：

en.js

test: {
  hello: 'My name is Ben'
}

如果我想让'name‘是蓝色的，另一个词是黑色的。

我尝试了以下代码：en.js

test: {
  hello: 'My <span style="color:blue">name<span> is Ben'
}

但它会显示出

My <span style="color:blue">name<span> is Ben

我怎样才能改正呢？

Answer 1

您不应该在i18n JSON中使用代码(只是文本)，而应该在模板中使用这样的条件

<div :class="$i18n.locale === 'en' ? 'color-blue' : 'color-red'">{{ $t('hello') }}</div>