文章讲述了在使用Vue-i18n时，设置`legacy:false`会导致多语言下拉菜单失效的问题，解决方案是将``中的`messages`替换为`list`，并在setup钩子中处理国际化对象。
错误信息 TypeError: _ctx.$t is not a functionat
解决方法：
在多语言 locale文件夹下的 index.js文件
添加 legacy: false,
const i18n = createI18n({
__VUE_I18N_LEGACY_API__: false,
__VUE_I18N_FULL_INSTALL__: false,
locale: locale,
fallbackLocale: "zh-cn",
globalInjection: true,
legacy: false,
messages,
});但是当 legacy: false,时会出现 多语言下拉框出不来
错误代码
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item
v-for="(locale, key) in $i18n.messages"
:key="`locale-${locale.message.language}`"
:command="key"
:disabled="name === key"
>
{{ locale.message.language }}
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>修改后代码
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item
v-for="(locale, key) in list"
:key="`locale-${locale.message.language}`"
:command="key"
:disabled="name === key"
>
{{ locale.message.language }}
</el-dropdown-item>
</el-dropdown-menu>
</template>
setup() {
const { locale, t ,messages} = useI18n()
const list = messages.value
return {
list
}
}具体情况具体分析...
456
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
