在使用I18n时使用Vue.extend翻译来自证监会的信息
在使用I18n时使用Vue.extend翻译来自证监会的信息
提问于 2018-12-14 15:31:58
我正在开发一个我要迁移到VueJS的应用程序，所以有些部分使用了旧的jQuery代码。
因此，我试图使用VueJS添加一个jQuery组件，所以我
import copyToClipboard from '../components/_base/VCopyToClipboard';
const CopyToClipboard = Vue.extend(copyToClipboard);
$(event.currentTarget).find('.dns-challenge-row').each((index, element) => {
const component = new CopyToClipboard({
propsData: {
targetId: $(element).find('code').attr('id'),
},
}).$mount();
$(element).append(component.$el);
});所有操作都正常，但是当我在附加此组件的页面上时，i18n返回一个错误
无法转换键盘'tooltip.default‘的值。使用键盘的值作为默认值。
我的翻译信息是在我的证监会内部使用i18n关键字直接定义的。
i18n: {
messages: {
en: {
tooltip: {
default: 'Copy content',
success: 'Copied',
},
},
fr: {
tooltip: {
default: 'Copier le contenu',
success: 'Copié',
},
},
},
},然后我直接在证监会内部使用this.$t('tooltip.default')
我的i18n是导入的，就像docs说的那样，但是在我用来创建组件的vue.js之后加载。
import {
Vue,
} from './vue';
import VueI18n from 'vue-i18n';
import en from '../../translations/en';
import fr from '../../translations/fr';
Vue.use(VueI18n);
export default new VueI18n({
locale: document.getElementsByTagName('html')[0].getAttribute('lang'),
messages: {
en,
fr,
},
});vue.js文件是我将所有Vue.use()定义、路由和其他东西放在其中的文件，用于在另一个文件中创建Vue实例
vueSetup(new Vue({
el: '#app',
components: {
...
},
i18n: i18n,
router: router,
store: store,
}));你有办法解决这个问题吗？
我试图在vue组件之前加载i18n，但没有成功，我看到了这个错误带来的许多GitHub问题，但不像我的情况那样。
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-12-26 13:39:15
只需导入i18n实例并将其添加到新的组件实例
const CopyToClipboard = Vue.extend(copyToClipboard);
$(event.currentTarget).find('.dns-challenge-row').each((index, element) => {
const component = new CopyToClipboard({
i18n: i18n,
propsData: {
targetId: $(element).find('code').attr('id'),
},
}).$mount();
$(element).append(component.$el);
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/53782660
复制相关文章
相似问题
腾讯云开发者
