VuePress: определить, работает ли в контексте предварительного рендеринга или в браузере - PullRequest
0 голосов
/ 04 апреля 2020

В логе c моего Vue компонента на моем сайте VuePress я могу определить, работает ли он в контексте vuepress build генерации состояния c HTML или в контексте подлинного сеанс браузера?

Мой вариант использования: я использую момент js для форматирования даты и времени относительно текущей даты и времени. например. Сказать «Вчера» вместо «2020-04-03».

Проблема заключается в том, что c HTML, который VuePress генерирует во время сборки, содержит фразу относительно даты, когда была произведена сборка. запустить. Я хочу, чтобы stati c HTML всегда содержала абсолютную, а не относительную дату и время.

Для посетителей сайта Vue запускается и заменяет предварительно обработанную дату / фразу на исправьте только что рассчитанную фразу / дату, и они не будут мудрее.

Для посетителей машин, которые не запускают JavaScript, они видят предварительно отрендеренную относительную фразу, которая является правильной только в день ее создания. .

В основном я хочу сделать что-то вроде этого:

if (/* in context of vuepress pre-rendering */) {
  return 'content for static HTML'; // eg '2020-04-03'
}
// else, In context of visitors browser
return 'my dynamic content that depends on the date at view time'; // eg 'Yesterday'

Заранее спасибо.

1 Ответ

0 голосов
/ 05 апреля 2020

Вы можете попытаться разделить ваш код на разные хуки жизненного цикла, чтобы достичь этого.

Создайте абсолютное время в хуке created вашего компонента Vue, а затем динамически рассчитайте относительное время в хуке mounted.

created будет вызываться как в ssr, так и в клиенте. Но код в mounted будет выполняться только во время клиента

...