Lissy93/dashy
1
1
Fork 0
mirror of https://github.com/Lissy93/dashy.git synced 2024-12-26 02:14:27 +03:00
Code Issues Packages Projects Releases Wiki Activity

✨ Adds target attribute to nav links (#552)

Browse Source
This commit is contained in:
Alicia Sykes 2022-03-26 20:03:54 +00:00
parent fd2b3d831c
commit b7c84bb1dd
1 changed files with 27 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/components/PageStrcture/Nav.vue
View File

@ -5,15 +5,23 @@
@click="navVisible = !navVisible"
/>
<nav id="nav" v-if="navVisible">
<router-link
v-for="(link, index) in links"
:key="index"
:to="link.path"
:href="link.path"
:target="isUrl(link.path) ? '_blank' : ''"
rel="noopener noreferrer"
class="nav-item"
>{{link.title}}</router-link>
<!-- Render either router-link or anchor, depending if internal / external link -->
<template v-for="(link, index) in links">
<router-link v-if="!isUrl(link.path)"
:key="index"
:to="link.path"
class="nav-item"
>{{link.title}}
</router-link>
<a v-else
:key="index"
:href="link.path"
:target="determineTarget(link)"
class="nav-item"
rel="noopener noreferrer"
>{{link.title}}
</a>
</template>
</nav>
</div>
</template>
@ -43,6 +51,16 @@ export default {
return screenWidth && screenWidth < 600;
},
isUrl: (str) => new RegExp(/(http|https):\/\/(\S+)(:[0-9]+)?/).test(str),
determineTarget(link) {
if (!link.target) return '_blank';
switch (link.target) {
case 'sametab': return '_self';
case 'newtab': return '_blank';
case 'parent': return '_parent';
case 'top': return '_top';
default: return undefined;
}
},
},
};
</script>