I have a following translation:
en.js
test: {
hello: 'My name is Ben'
}
If I want to let 'name' is blue word,other word is black.
I have tried following code:
en.js
test: {
hello: 'My <span style="color:blue">name<span> is Ben'
}
But it will show
My <span style="color:blue">name<span> is Ben
How can I correct it?
You should not have code in your i18n JSON (just text), rather use a conditional like this in your template
<div :class="$i18n.locale === 'en' ? 'color-blue' : 'color-red'">{{ $t('hello') }}</div>