v-slot can only be used in <template> tag

[alexpkalinka]

The docs say that it's possible to use v-slot syntax like this:

<i18n path="info" tag="p">
  <span v-slot:limit>{{ changeLimit }}</span>
  <a v-slot:action :href="changeUrl">{{ $t('change') }}</a>
</i18n>

https://kazupon.github.io/vue-i18n/guide/interpolation.html#slots-syntax-usage

However, Vue allows using v-slots only in <template> tag (or in top-level component element, but it does not matter in this case). So, here's a version that works:

<i18n path="info" tag="p">
  <template v-slot:limit>
    <span>{{ changeLimit }}</span>
  </template>
  <template v-slot:action>
    <a :href="changeUrl">{{ $t('change') }}</a>
  </template>
</i18n>

vue & vue-i18n version

Vue: 2.6.10
Vue-i18n: 8.14.1

Reproduction Link

https://jsfiddle.net/ayx8tczr/8/

What is Expected?

According to docs, the first i18n tag in the reproduction example should render correctly.

What is actually happening?

The slot in the first i18n tag is not rendered, and Vue throws a warning:

[Vue warn]: Error compiling template:

v-slot can only be used on components or <template>.

1  |  <div id="app">
2  |    <i18n tag="div" path="iuse">
3  |      <span v-slot:subject="">{{ $t('span_vslot') }}</span>
   |            ^^^^^^^^^^^^^^^^^
4  |    </i18n>
5  |    <i18n tag="div" path="iuse">

(found in <Root>)

[kazupon]

Thank you for your feedback!

v-slot can only be used on components or <template>.

Those error messages is correct.
Sorry, vue-i18n documentation is bad.

[arunragha89]

Still the documentation is not update - https://kazupon.github.io/vue-i18n/guide/number.html#custom-formatting