search

vuejs / router

🚦 The official router for Vue.js
https://router.vuejs.org/
MIT License
3.84k stars 1.18k forks source link

When top and el are specified in scrollBehavior, the offset scrolls in different directions. #2027

Closed yoshi-pi closed 10 months ago

yoshi-pi commented 10 months ago

Reproduction

https://jsfiddle.net/yoshipy/dhnvscf9/11/

Steps to reproduce the bug

Check the position of Hello

Expected behavior

It should scroll 10px above the element #hello because the code is

scrollBehavior() {
    return {
      top: -10,
      el: '#hello'
    }
  }

Actual behavior

It scrolls 10px below the element #hello.

Additional information

No response

posva commented 10 months ago

when only top is specified only positives values make sense, when an element is specified, it becomes a relative position, so the meaning is a bit different. It can seen as an offset of space in pixels needed between the top of the window and the element itself