Home » vue » What is jQuery like syntax doing in Vue.js?

What is jQuery like syntax doing in Vue.js?

Posted by: admin November 26, 2021 Leave a comment

Questions:

I was just going through some Vue.js code HERE and came across the following line of code:

.svg-icon.streak(v-html="icons.streak", v-b-tooltip.hover.bottom="$t('streakCounter')")

There is this jQuery like syntax $t() and i don’t quite understand it , what exactly is this function doing ? where is it coming from ? i see no such function being imported ?

Can somebody explain what this jQuery like syntax is doing ?

Answers:

This comes from the i18n : https://github.com/HabitRPG/habitica/blob/develop/website/client/libs/i18n.js

// Vue plugin to globally expose a '$t' method that calls common/i18n.t.
// Can be anywhere inside vue as 'this.$t' or '$t' in templates.

And you can find streakCounter here : https://github.com/HabitRPG/habitica/blob/1135ab946e11300c2199c14cb5451f7370ed0b28/website/common/locales/en/tasks.json#L57 (and in other translation file for different languages)