我正在使用 vuetify 的国际化,并且在使用 v-select 时我在浏览器上收到错误
[Vue warn]: Vuetify: Translation key "$vuetify.open" not found in "en", trying fallback locale
我的FilterAndSearch.vue
<v-col cols="8" md="3">
<v-select
v-model="selectedRegion"
density="compact"
bg-color="background"
:label="t('$vuetify.filter')"
append-inner-icon="fa-solid fa-caret-down"
variant="outlined"
:items="['Asia', 'Africa', 'Austrilasia', 'Europe', 'North America', 'South America' ]"
></v-select>
</v-col>
我的main.ts
import { createApp } from 'vue';
import App from '@/App.vue';
import '@/style.scss'
import { createVuetify } from 'vuetify'
const app = createApp(App);
const messages = {
en: {
title: 'Where in the world?',
search: 'Search for a country',
filter: 'Filter by Region',
},
fr: {
title: 'Où dans le monde?',
search: 'Rechercher un pays',
filter: 'Filtrer par Région',
}
}
const vuetify = createVuetify({
locale: {
locale: 'en',
fallback: 'fr',
messages,
},
theme: {
defaultTheme: 'light',
themes: {
light: {
dark: false,
colors: {
surface: 'hsl(0, 0%, 98%)',
background: 'hsl(0, 0%, 100%)',
primary: 'hsl(200, 15%, 8%)',
secondary: 'hsl(0, 0%, 52%)',
},
},
dark: {
dark: true,
colors: {
background: 'hsl(207, 26%, 17%)',
surface: 'hsl(209, 23%, 22%)',
primary: 'hsl(0, 0%, 100%)',
},
}
}
}
});
app.use(vuetify);
app.mount('#app');
如何解决问题,因为即使添加变量 open 并将其在 messages 变量中设置为空白也无法解决问题
您必须将
open
添加到您的 messages
变量
const messages = {
en: {
title: 'Where in the world?',
search: 'Search for a country',
filter: 'Filter by Region',
open: 'Open',
},
fr: {
title: 'Où dans le monde?',
search: 'Rechercher un pays',
filter: 'Filtrer par Région',
open: 'Open',
}
}