Vuetify 国际化

问题描述 投票:0回答:1

我正在使用 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 变量中设置为空白也无法解决问题

vuejs3 internationalization vuetify.js
1个回答
0
投票

您必须将

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',
  }
}
© www.soinside.com 2019 - 2024. All rights reserved.