Translation

Yes I did ,
I added the key into i18n.ts , not working
I useed this way in my all components and its working very well ,
but the issue when i want use it in route.ts
{
path: "/iphone",
name: "iphone",
component: () => import("@/views/device/iphones/iphone.vue"),
meta: {
pageTitle: "iphone",
breadcrumbs: ["samsung"],
},
},
What I want is a translation value of pageTitle Its value here is equal " iphone "

Hi Hosam Nouri,

If you want to translate these values inside index.ts you can refer to this comment.
https://github.com/intlify/vue-i18n-next/discussions/613#discussioncomment-2265983

I would suggest you instead of translating values inside the router file translate them inside components whenever you are using the page title.

Regards,
Lauris Stepanovs,
Keenthemes Support Team

How I can translate them inside components ,
How can I access the router file from the component ?

Hi Hosam Nouri,

You can use the code from my first comment.

import { useI18n } from "vue-i18n";

const { t } = useI18n();



const pageTitle = computed(() => {

 return t(route.meta.pageTitle as string);

});

<div ...>{t(pageTitle)}</div>

The thing I want is in the pageTitle.vue

const pageTitle = computed(() => {
return t(route.meta.pageTitle as string);
});

const breadcrumbs = computed(() => {
return t(route.meta.breadcrumbs as string);
});

Thanks ...

Hi Hosam Nouri,

Glad to hear that it worked for you. All the best with your project!

Regards,
Lauris Stepanovs,
Keenthemes Support Team