Vue introduit jquery pour obtenir un mouvement fluide

Cette fois, je vais vous présenter Vue pour introduire jquery pour obtenir un mouvement fluide. Quelles sont les précautions pour que Vue introduise jquery pour obtenir un mouvement fluide. Ce qui suit est un cas pratique, jetons un coup d'œil.

Dans le passé, l'implémentation animée de jquery était préférée, mais une telle méthode n'existe pas dans Vue. Comment obtenir un défilement fluide jusqu'à la position spécifiée en cliquant sur Navigation dans le projet Vue J'ai failli m'effondrer à cause de cet effet. J'ai vérifié en ligne pendant longtemps et j'ai découvert qu'il n'y avait pas de véritable solution à ce problème. J'ai déjà fait référence à un blogueur. L'idée de l'auteur : en faisant défiler par étapes régulières dans un certain laps de temps, l'effet d'un défilement fluide peut être vu à l'œil nu après un fonctionnement continu (cliquez pour voir). J'étais tellement excité que j'ai rapidement référencé le code et l'ai écrit, mais j'étais confus. . . Cela n'a eu aucun effet. Après avoir contacté le blogueur pour en discuter, je suis arrivé à la conclusion que ma version vue2.4 n'était peut-être pas compatible avec les minuteries, j'ai donc suggéré de rétrograder la version dans ce cas. . . Je ferais mieux de continuer à chercher comment l'implémenter. En fin de compte, je n'ai trouvé aucune bonne méthode. J'ai introduit jquery et j'ai utilisé la méthode animer pour obtenir cet effet avec quelques codes.

1.npm install jquery : npm installjquery--registry=<a href="http://www.php.cn/wiki/373.html" target="_blank">https : //<code>npm installjquery--registry=<a href="http://www.php.cn/wiki/373.html" target="_blank">https://</a>registry.npm.taobao.org --verbose registry.npm.taobao.org --verbose

2. Après une installation réussie, modifiez le fichier de configuration du webpack  : build--webpack.base.conf.js, comme indiqué dans la figure ci-dessous :

3. Importez ce plug-in jquery dans le script du modèle vue, et vous pourrez ensuite l'utiliser. Dans mon projet, la navigation et les autres modules sont des composants différents, puis j'utilise la méthode de transmission et de réception pour faire fonctionner l'index (la méthode de transmission et de réception est présentée en détail dans mon article de blog précédent, cliquez pour voir). l'effet dépend principalement de ce que je vois dans la case rouge. Juste le code, d'autres codes sont des choses dans mon projet, pas besoin de considérer :

Je crois que vous maîtrisez le. méthode après avoir lu le cas dans cet article, veuillez faire attention au chinois php pour des choses plus excitantes. Autres articles connexes en ligne !

Lecture recommandée :

Analyse du code de cas JS Promise

Explication détaillée de la mise en œuvre de la programmation asynchrone du nœud Async/Await

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!