Vue.js {{$t（'；msg'；）}中某些单词的格式

我正在写一个需要本地化的网页。因此，我需要将段落放入变量中：

index.vue

{{$t（'message.instructionTitle'）}
{{$t（'message.instructionFirst'）}

{{$t（'message.instructionSecond'）}

{{$t（'message.instructionThird'）}

{{$t（'message.instructionForth'）}

{{$t（'message.instructionFifth'）}

index.js

const消息={
嗯:{
信息：{
说明一：“你好，世界！”，
指令二：“…”，
//...
},
},
太平绅士：{
信息：{
//...
},
},
//..
};
导出默认消息；

如果我想在段落中的某些单词（例如

message.instructionFirst

）中添加一些样式（例如

color=red

），除了将这些单词与

message.instructionFirst

分开之外，我还应该做些什么

---

编辑：

例如，

instructionFirst

类似于：

你好，世界

我想：

你好，世界！

我有个主意，下面几行怎么样：

const messages = {
  redKeys: ['instructionFirst'],
  en: {
    message: {
      //...
    },
  },
  jp: {
    message: {
      //...
    },
  },
  //..
};
export default messages;

     <div class="descrip">
        <p 
           v-for="(value, key, index) in message"
           v-key="index"
           :class="{
             dTitle: key === 'message.instructionTitle'
             red: redKeys.includes[key],
           }"
        >{{$t(value)}}</p>
      </div>

然后，用以下行替换vue模板：

const messages = {
  redKeys: ['instructionFirst'],
  en: {
    message: {
      //...
    },
  },
  jp: {
    message: {
      //...
    },
  },
  //..
};
export default messages;

     <div class="descrip">
        <p 
           v-for="(value, key, index) in message"
           v-key="index"
           :class="{
             dTitle: key === 'message.instructionTitle'
             red: redKeys.includes[key],
           }"
        >{{$t(value)}}</p>
      </div>

{{$t（值）}}

如中所建议的，您可以使用组件方法将目标单词与样式化标记打包，并使用

v-html

应用结果：

创建一个方法（名为“

”highlight“

”），用于搜索给定字符串中的单词，并返回用所需标记包围目标单词的HTML：

导出默认值{
方法：{
突出显示（搜索词、输入）{
返回input.replace（新的RegExp（searchWord'ig'），w=>`${w}`）
}
}
}

在模板中，使用将每次翻译的

highlight（）

结果绑定到

p

的

innerHTML

：

---

很抱歉，您可能误解了我的意思。我希望

instructionFirst

中的一些单词是红色的，而不是整个

instructionFirst

是红色的。（见更新的问题）什么是

？@lawrencerone这只是一种表示“世界”是红色的方式。我不知道如何在堆栈溢出中给它一个颜色…一旦你弄清楚为什么/如何突出单词世界，你就可以使用js，然后使用

v-html=“highlight（$t（'message.instructionFirst'），$t（'message.instructionFirstWord'）”

来呈现它，instructionFirstWord或类似的单词在特定的语言中，请参阅：制作方法/混合/组件等