javascript一句話實現錨點功能
阿新 • • 發佈:2020-11-23
<template> <div style="height: 100%;"> <div @click="goView('i3')">gogogogogogo</div> <div id="i1" style="height: 100%;">1</div> <div id="i2" style="height: 100%;">2</div> <div id="i3" style="height: 100%;">3</div> <div id="i4" style="height: 100%;">4</div> <div id="i5" style="height: 100%;">5</div> </div> </template> <script> import { IndexBar, IndexAnchor } from "vant"; export default { components: { "van-index-bar": IndexBar, "van-index-anchor": IndexAnchor }, data() { return { indexList: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] }; }, methods: { goView(val) { document.querySelector("#" + val).scrollIntoView({ behavior: "smooth", block: "end", inline: "nearest" }); } } }; </script> <style lang="scss"> html, body, #app { height: 100%; } </style>
詳細用法MDN地址:https://developer.mozilla.org/zh-CN/docs/Web/API/Element/scrollIntoView