How to use $t('message.hello') from vue-i18n as title in q-data-tabe?
-
I’m using the vue-i18n library to get diffrent lauguages in .vue and I need to use it as column title in Quasar data-table.
I treid to use it thruogh a variable, but it doesnt work for me.
Any suggestions or experience for this case? -
I also gave up on computing the label for a q-collapsible, which I suspect is the same problem, and so I’d like to know what you find out.
Thanks. -
I’m not smarter then before! Could’nt figured it out, how to manage it! If you’ll find an solution, please tell me you’r way… thx
-
Did you try something like that:
columns: [
{
label: this.$i18n.t(‘name’),
field: ‘name’,
width: ‘150px’,
sort: true,
type: ‘string’
}]?
-
To be specific, the problem was to use a reactive variable to compose the label and have it change.
-
Like the user can choose exactly the label for different language for a column?
-
@kenium
It works like a charme! So logic! Inside of vue instance, reachable withthis
thx -
@maximilianfixl My pleasure
Happy to help
-
Sad. Currently @kenium 's trick doesn’t work for me. It fails on error: “TypeError: Cannot read property ‘t’ of undefined”.
Here is the complete code of component:
<template>
<q-table
:title = “$t(‘default.register’)”
:data = “tableData”
:columns = “columns”
row-key = “startingNumber”
/>
</template><script>
export default {
data: () => ({
columns: [{
name: ‘startingNumber’,
field: ‘startingNumber’,
label: this.$i18n.t(‘startingNumber’),
}],
tableData: [{
startingNumber: 1,}],
}),
};
</script><style>
</style>