i18n block not working in Vue 3 with options API

Reporting a bug?

The i18n custom block in SFC doesn’t work in Vue 3 when using the “older” options API.

The global translations are working, but the local translations aren’t.

Expected behavior

I expect my local translations to work when using the block

Reproduction

https://stackblitz.com/edit/vitejs-vite-qoza92?file=src/App.vue

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (4) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 16.14.2 - /usr/local/bin/node
    Yarn: 1.22.10 - /usr/local/bin/yarn
    npm: 7.17.0 - /usr/local/bin/npm
  npmPackages:
    @intlify/vite-plugin-vue-i18n: ^6.0.3 => 6.0.3 
    @vitejs/plugin-vue: ^3.1.0 => 3.1.0 
    @vue/compiler-sfc: ^3.2.39 => 3.2.39 
    vite: ^3.1.3 => 3.1.3 
    vue: ^3.2.39 => 3.2.39 
    vue-i18n: ^9.2.2 => 9.2.2 
    vue-tsc: ^0.40.13 => 0.40.13

Screenshot

No response

Additional context

No response

Validations

• Read the Contributing Guidelines
• Read the Documentation
• Check that there isn’t already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion
• The provided reproduction is a minimal reproducible example of the bug.

[SebastianMelinat]

Can confirm that @Adnan-kreiker 's workaround works, except for translations with substrings (something like Foo {bar}). To get them to work I made the hack a bit hackier:

    beforeCreate () {
      this.customT = function (...input: unknown[]) {
        const { t } = useI18n()
        // Causes error TS2556: A spread argument must either have a tuple type or be passed to a rest parameter.
        // @ts-ignore
        return t(...input)
      }
      Vue.prototype.$t = this.customT
    }

[kazupon]

Sorry, I’m currently busy with another developments. Please wait. 🙏