I have a template which receive a message key when an event triggered.
I passed the "message.i.wanted" to the template, but the i18n is not translating based on the key I passed.
How should I updated my code so i18n can translate based on the key i passed?
<template>
...
<v-card-text>{{ $t("messageKey") }}</v-card-text>
...
</template>
<script>
import EventBus from "@/eventbus/eventbus.js"
export default {
name: "DialogBox",
data() {
return {
messageKey: ""
}
},
methods: {
popUpDialog(message) {
console.log("message dialog " + messageKey);
this.messageKey = messageKey;
}
},
mounted: function () {
EventBus.$on("showMessageDialog", (messageKey) => {
this.popUpDialog(messageKey);
});
}
}
</script>
//en.json
{
"messageKey": "Hello world", // this was translated on the page
"message.i.wanted": "message I wanted"
}
