Vue i18n 动态获取不同语言的 title 属性

在 Vue 中使用 i18n 进行国际化切换时，可以通过以下方法动态获取不同语言对应的 title 属性：\n\n1. 首先，在 Vue 组件中引入 i18n 实例：\n\njavascript\nimport { i18n } from '@/plugins/i18n'; // 假设 i18n 实例已经创建并导出\n\n\n2. 在 Vue 组件的 computed 属性中定义一个计算属性来获取动态的 title 属性：\n\njavascript\nexport default {\n computed: {\n dynamicTitle() {\n return i18n.t('title'); // 使用 i18n 的 t 方法获取对应语言的 title 属性\n }\n }\n}\n\n\n3. 在 Vue 组件的模板中使用动态的 title 属性：\n\nhtml\n<template>\n <div>\n <h1>{{ dynamicTitle }}</h1>\n </div>\n</template>\n\n\n在以上代码中，i18n.t('title') 会根据当前选择的语言返回对应的 title 属性。你可以在 i18n 配置文件中设置不同语言的 title 属性，如：\n\njavascript\nconst messages = {\n en: {\n title: 'File Distribution',\n },\n zh: {\n title: '文件分发',\n }\n};\n\n\n当切换语言时，i18n.t('title') 会根据当前选择的语言返回对应的 title 属性值，从而实现动态获取不同的属性。