在组件外部使用 VueI18n 的问题

2023-12-25

我正在尝试在组件外部使用 i18n 我找到了这个解决方案https://github.com/dkfbasel/vuex-i18n/issues/16 https://github.com/dkfbasel/vuex-i18n/issues/16告诉使用 Vue.i18n.translate('str'),但是当我调用它时出现错误 Cannot read property 'translate' of undefined 。

我正在使用以下配置

main.js

import i18n from './i18n/i18n';
new Vue({
    router,
    store,
    i18n: i18n,
    render: h => h(App)
}).$mount('#app')

i18n.js

import Vue from 'vue'
import VueI18n from 'vue-i18n'
import i18nData from './i18nData'
Vue.use(VueI18n);
export default new VueI18n({
  locale: 'en',
  messages: i18nData,
});

i18nData.js

export default {
    en: {
        //my messages
    }
}

然后我尝试用这个

import Vue from 'vue';
Vue.i18n.translate('someMessage');

谁能帮我?


To use i18n与 Vue 3 的组合 API https://vue-i18n-next.intlify.dev/guide/advanced/composition.html,但在组件之外setup(), 你可以访问 https://vue-i18n.intlify.dev/guide/advanced/lazy.html#:%7E:text=outside%20of%20the%20component它的翻译API(例如t函数)在其上global财产 https://vue-i18n.intlify.dev/api/general.html#global.

例如在具有可单元测试的组合函数的文件中:

// i18n/index.js

import { createI18n } from 'vue-i18n'
import en from './en.json'

  ...

export default createI18n({
  datetimeFormats: {en: {...}},
  locale: 'en',
  messages: { en }
})
// features/utils.js

//import { useI18n } from 'vue-i18n'
//const { t } = useI18n() // Uncaught SyntaxError: Must be called at the top of a `setup` function

import i18n from '../i18n'

const { t } = i18n.global
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在组件外部使用 VueI18n 的问题 的相关文章

随机推荐