vue中使用锚点定位

30次阅读

共计 559 个字符,预计需要花费 2 分钟才能阅读完成。

vue 中使用锚点定位

<template>
<div>
<div>
  <a href="javascript:void(0)" v-anchor="index" v-for="index in 20"> {{index}} </a>
</div>
 <div :id="'anchor-'+index"class="item"v-for="index in 20" >{{index}}</div>
</div>
</template>
<script>
import Vue from 'vue'
import $ from 'jquery'
Vue.directive('anchor', {inserted: function (el, binding) {el.onclick = function () {document.documentElement.scrollTop = $('#anchor-' + binding.value).offset().top}
  }
})
export default{data () {return {}
  }
}
</script>
<style>
.item{
width: 100%;
height: 200px;
line-height: 200px;
text-align: center;
}

</style>

本文参考链接:https://blog.csdn.net/Null_Bu…

正文完
 0