P粉5462579132023-11-18 12:39:56
Tout d'abord, beforeRouteUpdate n'est déclenché que lorsque l'itinéraire réel est mis à jour, mais ne va pas vers un autre composant/page comme le officiel l'a dit ici .
Un exemple de ce qui pourrait déclencher un hook de cycle de vie est
<button @click="$router.push({ hash: `#${Math.floor(Math.random() * 10)}` })">
random hash
</button>
onBeforeRouteLeave Fonctionne parfaitement comme on peut s'y attendre lorsque l'on passe d'une page à une autre.
Pour la question d'origine, vous pouvez implémenter une sorte de middleware de routeur comme Nuxt le fait . De cette façon, vous pouvez effectuer des 等待 appels HTTP et seulement alors autoriser la navigation réelle. Il est donc presque possible de créer un effet de navigation en bloc.
Je ne sais pas comment l'écrire à l'aide de l'API Composition, mais je sais que cela fonctionne parfaitement avec l'API Options (de nombreux articles de blog sont disponibles). setup fonctionne lui-même selon son propre cycle de vie, et j'imagine que beaucoup de choses sont assez délicates.
TLDR : À mon avis, un bon middleware de routeur + un wrapper de page (comme la mise en page) est la combinaison parfaite dans votre cas. Là, vous pouvez configurer un observateur pour plusieurs pages en même temps.
Mais tout dépend de la manière dont vous souhaitez vous organiser et structurer votre code.
L'écran squelette donne une impression plus rapide que le blocage, mais en général, vous pouvez également utiliser prefetch< /a> (également livré avec Nuxt par défaut) pour obtenir des indices et éventuellement charger certaines ressources avant qu'elles ne soient nécessaires. (+ autres astuces dans le même domaine pour accélérer vos requêtes réseau)
répondre
0