Translate function breaks when used in store or asyncData

Version

5.12.7

Reproduction link

https://github.com/Frankwarnaar/nuxt-i18n-translate-from-store-bug-report

Steps to reproduce

Run npm install and then npm run dev. Then open http://localhost:3000.

What is expected ?

In vue’s mounted lifecycle hook on the index page, I dispatch my action alertTranslation, in which I alert the output of i18n’s $t function.

What is actually happening?

When running the $t function in the store, an exception is thrown: TypeError: Cannot read property 'apply' of undefined

Additional comments?

I’ve seen the same issue before, when I was trying to use the $t function is nuxt’s asyncData lifecycle hook.

<div align="right">_{This bug report is available on Nuxt community (#c254)}</div>

[rchl]

Actually it should just work (not sure if it was fixed or I was wrong before).

Example here: https://codesandbox.io/s/nuxt-i18n-string-from-asyncdata-fx64z

[lautr]

i’ll just leave this here in case somebody needs to use the translate method inside asyncData

export default ({ app }, inject) => {
  const _t = (key, values) => {
    // this looks odd, but is the way the translate has to be called outside of a template
    return app.i18n._t.apply(
      app.i18n,
      [key, app.i18n.locale, app.i18n._getMessages(), this].concat(values)
    )
  }

  inject('ta', (key, values) => {
    return _t(key, values)
  })
}