vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Menubar router demo fixes

pull/4468/head
Tuğçe Küçükoğlu 2023-09-18 12:28:45 +03:00
parent 0670cc6255
commit 9e18c87b47
2 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
doc/menubar/RouterDoc.vue
View File

@ -159,7 +159,7 @@ export default {
], ],
code: { code: {
basic: `<Menubar :model="items"> basic: `<Menubar :model="items">
<template #item="{ label, item, props, root }"> <template #item="{ label, item, props, root, hasSubmenu }">
<router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom> <router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom>
<a :href="routerProps.href" v-bind="props.action"> <a :href="routerProps.href" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
@ -169,14 +169,14 @@ export default {
<a v-else :href="item.url" :target="item.target" v-bind="props.action"> <a v-else :href="item.url" :target="item.target" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
<span v-bind="props.label">{{ label }}</span> <span v-bind="props.label">{{ label }}</span>
<span :class="[root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right']" v-bind="props.submenuicon" /> <span :class="[hasSubmenu && (root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right')]" v-bind="props.submenuicon" />
</a> </a>
</template> </template>
</Menubar>`, </Menubar>`,
options: `<template> options: `<template>
<div class="card relative z-2"> <div class="card relative z-2">
<Menubar :model="items"> <Menubar :model="items">
<template #item="{ label, item, props, root }"> <template #item="{ label, item, props, root, hasSubmenu }">
<router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom> <router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom>
<a :href="routerProps.href" v-bind="props.action"> <a :href="routerProps.href" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
@ -186,7 +186,7 @@ export default {
<a v-else :href="item.url" :target="item.target" v-bind="props.action"> <a v-else :href="item.url" :target="item.target" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
<span v-bind="props.label">{{ label }}</span> <span v-bind="props.label">{{ label }}</span>
<span :class="[root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right']" v-bind="props.submenuicon" /> <span :class="[hasSubmenu && (root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right')]" v-bind="props.submenuicon" />
</a> </a>
</template> </template>
</Menubar> </Menubar>
@ -332,7 +332,7 @@ export default {
composition: `<template> composition: `<template>
<div class="card relative z-2"> <div class="card relative z-2">
<Menubar :model="items"> <Menubar :model="items">
<template #item="{ label, item, props, root }"> <template #item="{ label, item, props, root, hasSubmenu }">
<router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom> <router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom>
<a :href="routerProps.href" v-bind="props.action"> <a :href="routerProps.href" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
@ -342,7 +342,7 @@ export default {
<a v-else :href="item.url" :target="item.target" v-bind="props.action"> <a v-else :href="item.url" :target="item.target" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
<span v-bind="props.label">{{ label }}</span> <span v-bind="props.label">{{ label }}</span>
<span :class="[root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right']" v-bind="props.submenuicon" /> <span :class="[hasSubmenu && (root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right')]" v-bind="props.submenuicon" />
</a> </a>
</template> </template>
</Menubar> </Menubar>

16
doc/menubar/TemplateDoc.vue
View File

@ -7,7 +7,7 @@
<template #start> <template #start>
<img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" height="40" class="mr-2" /> <img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" height="40" class="mr-2" />
</template> </template>
<template #item="{ label, item, props, root }"> <template #item="{ label, item, props, root, hasSubmenu }">
<router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom> <router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom>
<a :href="routerProps.href" v-bind="props.action"> <a :href="routerProps.href" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
@ -17,7 +17,7 @@
<a v-else :href="item.url" :target="item.target" v-bind="props.action"> <a v-else :href="item.url" :target="item.target" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
<span v-bind="props.label">{{ label }}</span> <span v-bind="props.label">{{ label }}</span>
<span :class="[root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right']" v-bind="props.submenuicon" /> <span :class="[hasSubmenu && (root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right')]" v-bind="props.submenuicon" />
</a> </a>
</template> </template>
<template #end> <template #end>
@ -165,7 +165,7 @@ export default {
<template #start> <template #start>
<img alt="logo" src="/images/logo.svg" height="40" class="mr-2" /> <img alt="logo" src="/images/logo.svg" height="40" class="mr-2" />
</template> </template>
<template #item="{ label, item, props, root }"> <template #item="{ label, item, props, root, hasSubmenu }">
<router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom> <router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom>
<a :href="routerProps.href" v-bind="props.action"> <a :href="routerProps.href" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
@ -175,7 +175,7 @@ export default {
<a v-else :href="item.url" :target="item.target" v-bind="props.action"> <a v-else :href="item.url" :target="item.target" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
<span v-bind="props.label">{{ label }}</span> <span v-bind="props.label">{{ label }}</span>
<span :class="[root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right']" v-bind="props.submenuicon" /> <span :class="[hasSubmenu && (root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right')]" v-bind="props.submenuicon" />
</a> </a>
</template> </template>
<template #end> <template #end>
@ -188,7 +188,7 @@ export default {
<template #start> <template #start>
<img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" height="40" class="mr-2" /> <img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" height="40" class="mr-2" />
</template> </template>
<template #item="{ label, item, props, root }"> <template #item="{ label, item, props, root, hasSubmenu }">
<router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom> <router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom>
<a :href="routerProps.href" v-bind="props.action"> <a :href="routerProps.href" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
@ -198,7 +198,7 @@ export default {
<a v-else :href="item.url" :target="item.target" v-bind="props.action"> <a v-else :href="item.url" :target="item.target" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
<span v-bind="props.label">{{ label }}</span> <span v-bind="props.label">{{ label }}</span>
<span :class="[root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right']" v-bind="props.submenuicon" /> <span :class="[hasSubmenu && (root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right')]" v-bind="props.submenuicon" />
</a> </a>
</template> </template>
<template #end> <template #end>
@ -350,7 +350,7 @@ export default {
<template #start> <template #start>
<img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" height="40" class="mr-2" /> <img alt="logo" src="https://primefaces.org/cdn/primevue/images/logo.svg" height="40" class="mr-2" />
</template> </template>
<template #item="{ label, item, props, root }"> <template #item="{ label, item, props, root, hasSubmenu }">
<router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom> <router-link v-if="item.route" v-slot="routerProps" :to="item.route" custom>
<a :href="routerProps.href" v-bind="props.action"> <a :href="routerProps.href" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
@ -360,7 +360,7 @@ export default {
<a v-else :href="item.url" :target="item.target" v-bind="props.action"> <a v-else :href="item.url" :target="item.target" v-bind="props.action">
<span v-bind="props.icon" /> <span v-bind="props.icon" />
<span v-bind="props.label">{{ label }}</span> <span v-bind="props.label">{{ label }}</span>
<span :class="[root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right']" v-bind="props.submenuicon" /> <span :class="[hasSubmenu && (root ? 'pi pi-fw pi-angle-down' : 'pi pi-fw pi-angle-right')]" v-bind="props.submenuicon" />
</a> </a>
</template> </template>
<template #end> <template #end>