En la lógica de mi componente Vue en mi sitio VuePress, ¿puedo determinar si se está ejecutando en el contexto de la vuepress build
generación del HTML estático o en el contexto de una sesión de navegador genuina?
Mi caso de uso es que estoy usando momentjs para formatear fechas y horas en relación con la fecha y hora actual. p.ej. Para decir "Ayer" en lugar de "2020-04-03".
El problema es que el HTML estático que genera VuePress en el momento de la compilación contiene la frase relativa a la fecha en la que se ejecutó la compilación. Quiero que el HTML estático siempre contenga la fecha y hora absoluta, no la relativa.
Para los visitantes humanos del sitio, Vue ejecuta y reemplaza la fecha / frase pre-renderizada con la frase / fecha correcta recién calculada y no se dan cuenta.
Para los visitantes de la máquina que no ejecutan JavaScript, ven la frase relativa pre-renderizada que solo es correcta el día en que se construyó.
Básicamente quiero hacer algo como esto:
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'
Gracias por adelantado.
Puede intentar separar su código en diferentes ganchos de ciclo de vida para lograrlo.
Genere el tiempo absoluto en el created
gancho de su componente Vue y luego calcule dinámicamente el tiempo relativo en el mounted
gancho.
created
se llamará durante ssr y cliente. Pero el código mounted
solo se ejecutará durante el cliente
Este artículo se recopila de Internet, indique la fuente cuando se vuelva a imprimir.
En caso de infracción, por favor [email protected] Eliminar
Déjame decir algunas palabras