Maison  >  Article  >  interface Web  >  Comment implémenter des points d'ancrage simulés dans vue2.0

Comment implémenter des points d'ancrage simulés dans vue2.0

php中世界最好的语言
php中世界最好的语言original
2018-04-11 14:07:371795parcourir

Cette fois, je vais vous montrer comment implémenter la simulation point d'ancrage dans vue2.0 Quelles sont les précautions pour implémenter le point d'ancrage de simulation dans vue2.0. Voici un cas pratique, jetons un oeil.

Solution :

<a href="javascript:void(0)" rel="external nofollow" @click="goAnchor(&#39;#anchor&#39;)"> 灰啊灰啊我的骄傲放纵</a>
methods: {
 goAnchor(selector) {
  var anchor = this.$el.querySelector(selector)
  document.body.scrollTop = anchor.offsetTop
 }
}

17. 9. 20 Mise à jour : Ce qui précède a un BUG dans FireFox, le correctif est le suivant :

methods: {
 goAnchor(selector) {
  var anchor = this.$el.querySelector(selector)
  document.body.scrollTop = anchor.offsetTop; // chrome
  document.documentElement.scrollTop = anchor.offsetTop; // firefox
 }
}

Je pense que vous avez lu le cas dans cet article. Après avoir maîtrisé la méthode, veuillez prêter attention aux autres articles connexes sur le site Web php chinois pour un contenu plus passionnant !

Lecture recommandée :

Comment utiliser la configuration sass dans le projet vue

Comment utiliser l'attribut on-change dans IView

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn