Vuetify语言环境在Datepicker标头中不起作用

问题描述

我在法国语言环境中使用vuetify datepicker。尽管日历中的所有内容都很好，但是“选择的”翻译不适用，但是当我选择两个日期而不是“sélectionnés”时，它将写为“选择的”。我做错了什么吗？

<!DOCTYPE html>
<html>
<head>
  <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
  <link href="https://cdn.jsdelivr.net/npm/@mdi/[email protected]/css/materialdesignicons.min.css" rel="stylesheet">
  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/vuetify.min.css" rel="stylesheet">
  <Meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,minimal-ui">
</head>
<body>
  <div id="app">
    <v-app>
      <v-main>
        <div id="app">
          <v-app id="inspire">
            <v-row>
              <v-col cols="12" sm="6">
                <v-date-picker locale="fr"  v-model="dates" range></v-date-picker>
              </v-col>
              <v-col cols="12" sm="6">
                <v-text-field v-model="daterangeText" label="Date range" prepend-icon="mdi-calendar" readonly></v-text-field>
                model: {{ dates }}
              </v-col>
            </v-row>
          </v-app>
        </div>
      </v-main>
    </v-app>
  </div>

  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vuetify.js"></script>
  <script>
    new Vue({
      el: '#app',vuetify: new Vuetify(),data: () => ({
        dates: ['2019-09-10','2019-09-20'],}),computed: {
        daterangeText () {
          return this.dates.join(' ~ ')
        },},})
  </script>
</body>
</html>

谢谢。

解决方法

这对我有用：

<v-date-picker
              v-model="date"
              locale="fr"
              selectedItemsText="{0} sélectionnés"
>

再见。

datepicker datepicker vuetify.js