v-t directive not works

[kochizufan]

Hi

I use vue-i18next with i18next-xhr-backend.
I used such locale files.

en/translation.json

{
  "navbar": {
    "mapEdit": "Edit Map"
  }
}

ja/translation.json

{
  "navbar": {
    "mapEdit": "地図編集"
  }
}

And if I use this in template:

<a href="#">{{$t('navbar.mapEdit')}}</a>

works fine.

But

<a href="#" v-t="{path:'navbar.mapEdit'}"></a>

Don't work (The result is, just showing "navbar.mapEdit").

How to solve this?

[kochizufan]

In addition:

<a href="#" v-waitForT>$t("navbar.mapEdit")</a>

Also don't work (The result is, just showing "$t("navbar.mapEdit")").

[kochizufan]

I found another phenomena.

If I use only "v-t" directives only in template, like

<a href="#" v-t="{path:'navbar.mapEdit'}"></a>
<a href="#" v-t="{path:'navbar.appEdit'}"></a>
<a href="#" v-t="{path:'navbar.settings'}"></a>

All directives don't work.

But, if I use directives together with {{$t('foo')}} syntax, like

<a href="#" v-t="{path:'navbar.mapEdit'}"></a>
<a href="#" v-t="{path:'navbar.appEdit'}"></a>
<a href="#">{{$t('navbar.settings')}}</a>

Both directives and {{$t}} syntax work well.

Little confusing..

[Szymon-dziewonski]

Same, I cant make v-t or v-waitForT work :(