Adding `scope` option to translations

Feature request

I would like to be able to do the following in components:

this.$t('message.path', { scope: 'my.very.long.scope.to.the.message' })
// or
const myScope = 'my.very.long.scope.to.the.message'
this.$t('message.path', { scope: myScope })

or even better:

const MyComponent = {
  template: `<p v-t="'message.path'"></p>`,
  i18n: { scope: myScope }
}

So basically, my goal would be to have my locale messages in one place and provide a socpe for a component, so that I can type less when translating lots of deeply nested messages.

All I can do now is:

const MyComponent = {
  template: `<p v-t="myScope + '.message.path'"></p>`,
  data () {
    return { myScope = '...' }
  },
  // and
  methods: {
    translateMessage (message) { return this.$t(`${this.myScope}.${message}`) }
  }
}

But having a scope option for components would be more elegant (or, at least, less cumbersome…). Of course, the fallback logic should be considered too.

@kazupon what do you think?

Also, I would be more than happy to try and provide a PR for the feature.

---

IssueHunt Summary

Backers (Total: $15.00)

• 0maxxam0 ($10.00)
• varna ($5.00)

Become a backer now!

Or submit a pull request to get the deposits!

Tips

• Checkout the Issuehunt explorer to discover more funded issues.
• Need some help from other developers? Add your repositories on IssueHunt to raise funds.

[paulgeisler]

How is this feature coming along?

[vansteki]

+1 for scope option SFC i18n custom block is good. But I think the scope is also a helpful and practical feature.