CODEWITHSUNDEEP
vue.jsinternationalizationvue-i18n
Gorilka
Gorilka

Reputation: 504

How to declare custom Pluralization Rules vue-i18n Vue 3?

I have a rule for pluralization from https://kazupon.github.io/vue-i18n/guide/pluralization.html#accessing-the-number-via-the-pre-defined-argument But declaring it in the form

setup() {
    const { t, locale } = useI18n({
      pluralizationRules: {
        ru: function (choice, choicesLength) {
          if (choice === 0) {
            return 0;
          }

          const teen = choice > 10 && choice < 20;
          const endsWithOne = choice % 10 === 1;

          if (choicesLength < 4) {
            return !teen && endsWithOne ? 1 : 2;
          }
          if (!teen && endsWithOne) {
            return 1;
          }
          if (!teen && choice % 10 >= 2 && choice % 10 <= 4) {
            return 2;
          }

          return choicesLength < 4 ? 2 : 3;
        },
      },
    });
    return { t, locale };
  },

does not change anything (that is, for 0 - секунд, 1 - секунда, and the rest is секунд)

I need

...1 секунда

...2-...3-...4 секунды

...0-...5-...6-...7-...8-...9 секунд

<i18n>
{
  "en": {
    "seconds":"{count} seconds | {count} second | {count} seconds"
  },
  "ru":{
    "seconds":"{count} секунд | {count} секунда | {count} секунд"
  }
}
</i18n>

Upvotes: 0

Views: 1134

Answers (2)

Alex Udovik
Alex Udovik

Reputation: 1

Try to fix your <i18n> file with:

"ru":{
    "seconds":"{count} секунд | {count} секунда | {count} секунды | {count} секунд"
  }

Upvotes: 0

Sergey Potanin
Sergey Potanin

Reputation: 41

I've quickly looked into the sources of vue-i18n and noticed that there are both pluralRules and pluralizationRules with the same type. For me it worked using pluralRules instead of pluralizationRules.

Upvotes: 4

Related Questions