Как задать ссылку в меню к id секции во Vue JS?

Question

[TuMko]

Здравствуйте. Есть меню лендинга, ссылки которого ведут на нужный блок с прокруткой страницы. Как правильно задать вывод ссылок?

<ul class="menu-list">
  <li><a class="menu-list-item" href="#about">About Me</a></li>
  <li><a class="menu-list-item" href="#users">Users</a></li>
  <li><a class="menu-list-item" href="#register">Sign Up</a></li>
</ul>

Если выводить так, то ссылки не работают:

<li><router-link class="menu-list-item" to="#about">About Me</router-link></li>

Так же заданы маршруты в router:

{
    path: '/about',
    name: 'About',
    component: () => import('../components/About.vue')
  },
  {
    path: '/users',
    name: 'Users',
    component: () => import('../components/Users.vue')
  },
  {
    path: '/register',
    name: 'Register',
    component: () => import('../components/Register.vue')
  }

Comments

[Алексей Ярков]

Вы сами видите что пишете? По вашему '/about' и '#about' - одинаковые записи?

[WapSter]

Это делается точно так же как и в html без vue.

[TuMko]

Алексей Ярков, я писал и '#about' и '/about' - результата это не дало.

Answer 1

[Антон Антон]

Если это одна страница, которая прокручивается, роутер не нужен.