Balise `<server-only>` pour le rendu côté serveur uniquement

Question

J'ai du code qui doit uniquement être rendu côté client, je l'enveloppe donc dans une balise

Cependant, pour éviter que le contenu ne rebondisse, j'ai essayé de restituer l'élément uniquement côté serveur, en utilisant le code suivant :

<div v-if="$isServer" class="h-nonav bg-gray-500" />

Cela fonctionne, mais Vue se plaindra que le code HTML côté serveur est incohérent avec celui côté client.

Bien que cela fonctionne, cela semble un peu hackish et entraînera le rendu de la page deux fois :

...
données() {
  retour {
    ssr : vrai
  }
},
monté() {
  ceci.ssr = faux
},
J'ai essayé de rechercher dans la documentation, mais la balise  n'a pas été trouvée :(

Answer 1

Ce n'est pas grave, corrigez-le en utilisant v-show代替v-if :

<div v-show="$isServer" />

J'espère que cela m'aidera encore...