【Vue】iview + vue-i18n Modal和DatePick组件不能翻译

问题描述

项目使用iview 并使用了vue-i18n插件，基本都能翻译，但是目前发现 iview的Modal和DatePick不能翻译，也不报错

问题出现的环境背景及自己尝试过哪些方法

目前网上又两种解决方法：

  1. Vue.prototype._i18n = i18n;（https://www.jianshu.com/p/e22...）

【Vue】iview + vue-i18n Modal和DatePick组件不能翻译
https://segmentfault.com/a/11...

但我这都不起作用

相关代码

----------------------------------分界线-----------------------------------

locale/index
import Vue from 'vue';
import VueI18n from 'vue-i18n';
import customZhCn from './lang/zh-CN';
import customEnUs from './lang/en-US';
import zhCnLocale from 'webbase/dist/locale/zh-CN';
import enUsLocale from 'webbase/dist/locale/en-US';
// import zhCnLocale from 'webbase/src/locale/lang/zh-CN';
// import enUsLocale from 'webbase/src/locale/lang/en-US';
Vue.use(VueI18n);
const locales = {
'zh-CN': Object.assign(customZhCn, zhCnLocale),
'en-US': Object.assign(customEnUs, enUsLocale)
};
// 默认语言
const DEFAULT_LANG = 'zh-CN';
// localStorage存储的语言设置
const STORAGE_LANG = 'locale';
// 自动根据浏览器系统语言设置语言
const navLang = navigator.language;
const localLang = locales[navLang] ? navLang : false;
let lang = localStorage.getItem(STORAGE_LANG) || localLang || DEFAULT_LANG;
// vue-i18n 6.x+写法
Vue.locale = () => {
};
const messages = locales;
const i18n = new VueI18n({
locale: lang,
messages
});
export default i18n;

----------------------------------分界线-----------------------------------

main.js
Vue.use(webBase, {i18n: (key, value) => i18n.t(key, value)});
new Vue({
el: '#app',
i18n,
router,
store,
render: (h) => h(App)
}

其中webBase是相当于iview，加了自己定义的组件，其功能相同

你期待的结果是什么？实际看到的错误信息又是什么？

有没有遇到这个问题的，一起看看

回答

模态框翻译的那个我看iview文档找到了解决办法， 页脚确认和取消是这个 okText:this.$t('mem.ok'),cancelText:this.$t('mem.cancel')做，连起来是这个

this.$Modal.confirm({
    title: this.$t('mem.confirm'),
    content:this.$t('mem.content'),
    okText:this.$t('mem.ok'),
    cancelText:this.$t('mem.cancel'),
    onOk: this.confirmRemove
    })

不过，关于分页的那个，我暂时还没有想到好的方法

以上是 【Vue】iview + vue-i18n Modal和DatePick组件不能翻译 的全部内容， 来源链接： utcz.com/a/85241.html

回到顶部