VueJS Router-link с href не работает должным образом - PullRequest
0 голосов
/ 16 июня 2020

У меня есть этот код:

<router-link class="xhover" to="/support">
    <span class="icon"><IconHelp /></span>
    <ul class="dropdown-menu nav-menu" ref="help">
        <li><router-link to="/support">Get in contact</router-link></li>
        <li><router-link to="/support/video">Intro Video</router-link></li>
        <li><a href="https://google.com" target="_blank">Help Docs</a></li>
        <li><a href="https://facebook.com/api" target="_blank">API Docs</a></li>
        <li><a href="https://github.com" target="_blank">Github</a></li>
    </ul>
</router-link>

Итак, в основном это то, что, когда пользователь наводит курсор на ссылку «поддержка» на моем веб-сайте, он показывает <ul><li></li>...</ul> элементов. Моя проблема здесь в том, что когда это отображается, пользователь нажимает ссылку «Справочная документация», «Документы API» или «Github», он перенаправляет на страницу /support вместо значения href там . Я думаю, что существует конфликт между router-link и href.

Я не знаю, как поместить href внутри router-link.

Любая помощь будет очень оценен.

Спасибо.

1 Ответ

0 голосов
/ 16 июня 2020

похоже, что <router-link class="xhover" to="/support"> отменяет все дочерние ссылки.

Сделайте это как-нибудь таким образом:

<router-link class="xhover" to="/support"></router-link>
    <span class="icon"><IconHelp /></span>
    <ul class="dropdown-menu nav-menu" ref="help">
        <li><router-link to="/support">Get in contact</router-link></li>
        <li><router-link to="/support/video">Intro Video</router-link></li>
        <li><a href="https://google.com" target="_blank">Help Docs</a></li>
        <li><a href="https://facebook.com/api" target="_blank">API Docs</a></li>
        <li><a href="https://github.com" target="_blank">Github</a></li>
    </ul>
...