Vue i18n pluralization with multiple parameters

Hi I'm using i18n internationalization in my Vue app. It works for simple statements without any additional parameters but when I have additional parameters it doesn't seem to register them at all. For example, in my locale I have the following messages:

en: {
  message: {
    imageMessage: "1 image downloaded on {date} ({space} Mb) | {n} images downloaded on {date} ({space} Mb)"

Here date and space are the additional parameters, not related to pluralization. In my vue template I have the following code:

$t('message.imageMessage', images.num, {date:, space:})

The messages that end up getting printed are either: 1 image downloaded on ( Mb) or of the form: 5 images downloaded on ( Mb)

Is there a way to have these additional parameters printed in the messages as well?

I tried some other stopgap solutions that included conditional statements that were able to achieve this but was wondering if there was a way to achieve this without any additional logic.


  • the problem here is that the order of parameters for calling $t is changed.

    Instead of:

    $t('message.imageMessage', images.num, {date:, space:})

    You need to pass them as:

    $t('message.imageMessage', {date:, space:}, images.num)

    Here you have the documentation for vue-i18n v9: