要实现本地化资源的路由URL但保留名称,可以使用以下解决方法:
// 路由配置
const routes = [
{
path: '/:locale/home',
name: 'home',
component: Home
},
{
path: '/:locale/about',
name: 'about',
component: About
}
]
// 组件中获取路由参数
export default {
computed: {
locale() {
return this.$route.params.locale
}
},
// ...
}
{{ $t('home.title', { locale: locale }) }}
{{ $t('home.description', { locale: locale }) }}
// 在代码中使用本地化资源
// ...
const title = this.$t('home.title', { locale: this.locale })
// ...
通过以上解决方法,可以实现本地化资源的路由URL但保留名称的效果。根据不同的本地化资源标识,可以动态地加载相应的本地化资源,并在页面中使用。