Почему переходит не по нужному адресу?

Question

[Anonymous]

Доброй ночи. Пишу сайтек. У меня такая проблема.
Я прописываю в роутере:

import {createRouter, createWebHashHistory} from "vue-router"
import MainPage from "@/views/MainPage.vue";

export default createRouter({
    history: createWebHashHistory(),
    routes: [
        {
            path: "/home",
            component: MainPage,
        },
        {
            path: "/registration",
            component: undefined,
        },
        {
            path: "/login",
            component: undefined,
        },
    ],
})

Но проблема.
Я пишу ссылку:

<router-link to="/login" class="block-photo__button">Регистрация</router-link>
<router-link to="/registration" class="block-photo__button">Войти</router-link>

Но в итоге переходит не в /registration или /login, а в /home#/login или /home#/registration. А также мне не нравится решетка в ссылке. Хотелось бы ее убрать. И исправить проблему с переходом, надо в корень переходить.

Answer 1

[Данил Бабаков]

По поводу "#" и добавления в урл пути - Вы используете createWebHashHistory, который использует именно хеши для роутинга.
Нужно избавиться от # - createWebHistory. (читаем доку https://router.vuejs.org/guide/essentials/history-...)
И используйте формат роутинга

routes: [
        {
            path: "/routePath",
            name: "routeName",
            component: routeComponent,
        },
        ...
   ]
 <router-link :to="{ name: 'routeName' }">