Moment Js загружает локализацию слишком поздно при ленивой загрузке
Итак, я попробовал два способа установить языковой стандарт Moment.js. Оба способа не сработают, или я должен сказать, что уже слишком поздно. Мое «желание» - импортировать файлы локали в асинхронном режиме (вдохновленный здесь).
Когда я перехожу на свою страницу, дата по-прежнему отображается в английском формате, хотя, например, она должна быть на немецком языке.
Я загружаю данные асинхронно:
window.moment = require('moment');
moment().format();
window.moment = require('moment-shortformat');
moment().short()
window.moment = require('moment-timezone');
const lang = document.documentElement.lang.substr(0, 2); //for the language
if (lang != 'en'){
import(`moment/locale/${lang}.js`);
moment.locale(lang)
}
Поскольку import(moment/locale/${lang}.js); разрешает обещание, я проверил в консоли, когда файл загружен. Это примерно через 1 секунду после строки moment.locale(lang) (неудивительно, что момент не готов отображать правильную переведенную дату).
Небольшая проверка на работоспособность показывает: локаль установлена правильно, когда я записываю moment.locale() в консоль.
Если я не использую ленивую загрузку, например:
import 'moment/locale/de';
moment.locale(lang);
Все нормально работает.
Мой второй подход немного длиннее, но все равно не повезло. Подвести итог. Я создал файл javascript на бэкэнде с помощью php с помощью:
...
$file = base_path('node_modules/moment/locale/' . $locale . '.js');
...
поэтому я могу динамически вызывать нужный файл js. Но все равно не повезло.
Есть идеи, что я делаю не так?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Правильно, если он асинхронный и ожидает обещания, вам нужно связать вызов then(). Вот пример из https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import
import('/modules/my-module.js')
.then((module) => {
// Do something with the module.
});
Поскольку динамический импорт возвращает обещание, вы можете вызвать момент.locale, когда обещание выполнено:
if (lang != 'en'){
import(`moment/locale/${lang}.js`).then(module => {
moment.locale(lang)
});
}
Да, я знаю, что пробовал это раньше, но все равно не повезло :( мой Vue просто быстрее, чем обещание, и поэтому он все еще отображается неправильно
Извините, забыл упомянуть, что явно пробовал это в обещании. На самом деле не имеет значения, поставили вы его там или снаружи. Тем не менее, мне не повезло с этим подходом, потому что Vue быстрее загружает момент, когда устанавливает локаль.