element-plus
Version:
> TODO: description
92 lines (91 loc) • 3.02 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.useLocaleInject = exports.localeProviderMaker = exports.useLocale = exports.LocaleInjectionKey = exports.useLocaleProps = void 0;
const vue_1 = require("vue");
const en_1 = __importDefault(require("../../locale/lang/en"));
exports.useLocaleProps = {
locale: {
type: Object,
},
};
exports.LocaleInjectionKey = 'ElLocaleInjection';
// this is meant to fix global methods like `ElMessage(opts)`, this way we can inject current locale
// into the component as default injection value.
// refer to: https://github.com/element-plus/element-plus/issues/2610#issuecomment-887965266
let localeObjCache;
function translate(path, option, current) {
const paths = path.split('.');
let value;
for (let i = 0, j = paths.length; i < j; i++) {
const property = paths[i];
value = current[property];
if (i === j - 1)
return template(value, option);
if (!value)
return '';
current = value;
}
}
const useLocale = () => {
const vm = vue_1.getCurrentInstance();
const props = vm.props;
const locale = vue_1.computed(() => props.locale || en_1.default);
const lang = vue_1.computed(() => locale.value.name);
const _translator = (...args) => {
const [path, option] = args;
return translate(path, option, locale.value);
};
const t = (...args) => {
return _translator(...args);
};
const provides = {
locale,
lang,
t,
};
// this could be broken if someone tries to do following:
/**
* <config-provider :locale="lang1">
* <config-provider :locale="lang2">
* Something calls modal component.
* </config-provider>
* </config-provider>
*/
localeObjCache = provides;
vue_1.provide(exports.LocaleInjectionKey, provides);
};
exports.useLocale = useLocale;
function template(str, option) {
if (!str || !option)
return str;
return str.replace(/\{(\w+)\}/g, (_, key) => {
return option[key];
});
}
const localeProviderMaker = (locale = en_1.default) => {
const lang = vue_1.ref(locale.name);
const localeRef = vue_1.ref(locale);
return {
lang,
locale: localeRef,
t: (...args) => {
const [path, option] = args;
return translate(path, option, localeRef.value);
},
};
};
exports.localeProviderMaker = localeProviderMaker;
const useLocaleInject = () => {
return vue_1.inject(exports.LocaleInjectionKey, localeObjCache || {
lang: vue_1.ref(en_1.default.name),
locale: vue_1.ref(en_1.default),
t: (...args) => {
const [path, option] = args;
return translate(path, option, en_1.default);
},
});
};
exports.useLocaleInject = useLocaleInject;