最近碰到乙個常見的需求，今天來整理一下思路
點選錨點 頁面滾動到指定位置，這個很常見
當需要滾動頁面的時候 點選欄(選單欄) 同步展示高亮 這個怎麼完成呢？
話不多說 貼**
1. 這是頭部點選跳轉部分
<這個anchor 是給每個區域 命名的 id值template
>
<
div
class
="privilege-head"
>
<
ul>
<
li
:class
=""@click
="privilegeheadclick(item.anchor, index)"
v-for
="(item, index) in privilegeheadlist"
:key
="index"
class
="pointer"
>
<
img
:src
="active == index ? item.icon_on : item.icon"
alt=""
/>
<
p class
="transition"
>}
p>
li>
ul>
div>
template
>
privilegeheadclick(anchor, index) `).scrollintoview();2. 這是需要展示的內容區域關鍵的是這個 @scroll="onscroll" 事件 相當於監聽滾動了});},
3. 計算滾動距離
onscroll(e) }}這個 activestep 就是點選欄部分需要高亮的下標值
4. 最後讓 active = activestep 就可以了
好啦， 到此就完美結束。
vue中實現錨點跳轉及滾動監聽的簡便方法
注意 如果scroll item的最後乙個元素高度必須大於等於滾動區域的高度，不然最後乙個元素就滾動不上去，scrollintoview介面的具體引數說明 html結構 list for item,index in title list key index spans style click jum...
vue專案監聽滾動事件，實現動態錨點
前幾天做專案的時候，需要實現乙個動態錨點的效果 如果是傳統專案，這個效果就非常簡單。但是放到 vue 中，就有兩大難題 1.在沒有 jquery 的 animate 方法的情況下，如何實現平滑滾動？2.如何監聽頁面滾動事件？在瀏覽了大量文章 進行多次嘗試之後，終於解決了這些問題 期間主要涉及到了 s...
Vue使用原生JS實現錨點跳轉滾動效果
本文使用iview 左側導航元素 測試 右側滾動元素 史蒂夫 賈伯斯 斯蒂夫 蓋瑞 沃茲尼亞克 斯蒂夫 蓋瑞 沃茲尼亞克 stephen gary wozniak 美國電腦工程師，曾與史蒂夫 賈伯斯合夥創立蘋果電腦 今之蘋果公司 斯蒂夫 蓋瑞 沃茲尼亞克曾就讀於美國科羅拉多大學，後轉學入美國著名高等...