升级Nuxt3与@nuxtjs/i18n后，无法用v-for遍历翻译数组？

翻译文件内容 #

我们的翻译文件en.js包含如下数组结构：

section: {
   title: 'This value is a string and it works just fine',
   highlighted: [
      {
         title: 'Highlighted title 1',
         text: 'Highlighted text 1'
      },
      {
         title: 'Highlighted title 2',
         text: 'Highlighted text 2'
      }
   ]
}

Nuxt2 + nuxt-i18n 中的正常用法 #

在Nuxt2搭配nuxt-i18n时，我们可以正常调用数组类型的翻译值：

<h2>{{ $t('section.title') }}</h2>
<template v-for="(item, index) in $t('section.highlighted')" :key="item.title">
    {{ item.title }} 
    {{ item.text }}
</template>

Nuxt3 + @nuxtjs/i18n 中的异常表现 #

升级到Nuxt3搭配@nuxtjs/i18n后，调用$t('section.highlighted')无法返回预期的数组，而是返回键名字符串的每个字符：

s
e
c
t
i
o
n
.
h
i
g
h
l
i
g
h
t
e
d

当前nuxt.config.js配置 #

我的Nuxt3配置文件中关于i18n的部分如下：

modules: [
  '@nuxtjs/i18n',
],
i18n: {
  locales: ['en', 'de'],
  defaultLocale: 'en',
  vueI18n: {
    legacy: false,
    fallbackLocale: 'en',
    messages: {
      en,
      de
    }
  }
},

疑问 #

我遗漏了什么必要配置？在官方迁移指南中未找到相关说明。

内容的提问来源于stack exchange，提问作者Toni Michel Caubet