Update #3965 - Menu exact check fix
parent
c143ea93bf
commit
8342f75e31
|
@ -42,11 +42,11 @@ const classes = {
|
|||
home: 'p-breadcrumb-home',
|
||||
separator: 'p-menuitem-separator',
|
||||
menuitem: ({ instance }) => ['p-menuitem', { 'p-disabled': instance.disabled() }],
|
||||
action: ({ instance, isActive, isExactActive }) => [
|
||||
action: ({ props, isActive, isExactActive }) => [
|
||||
'p-menuitem-link',
|
||||
{
|
||||
'router-link-active': isActive,
|
||||
'router-link-active-exact': instance.exact && isExactActive
|
||||
'router-link-active-exact': props.exact && isExactActive
|
||||
}
|
||||
],
|
||||
icon: 'p-menuitem-icon',
|
||||
|
|
|
@ -63,11 +63,11 @@ const classes = {
|
|||
}
|
||||
],
|
||||
content: 'p-menuitem-content',
|
||||
action: ({ instance, isActive, isExactActive }) => [
|
||||
action: ({ props, isActive, isExactActive }) => [
|
||||
'p-menuitem-link',
|
||||
{
|
||||
'router-link-active': isActive,
|
||||
'router-link-active-exact': instance.exact && isExactActive
|
||||
'router-link-active-exact': props.exact && isExactActive
|
||||
}
|
||||
],
|
||||
icon: 'p-menuitem-icon',
|
||||
|
|
|
@ -144,11 +144,11 @@ const classes = {
|
|||
}
|
||||
],
|
||||
content: 'p-menuitem-content',
|
||||
action: ({ instance, isActive, isExactActive }) => [
|
||||
action: ({ props, isActive, isExactActive }) => [
|
||||
'p-menuitem-link',
|
||||
{
|
||||
'router-link-active': isActive,
|
||||
'router-link-active-exact': instance.exact && isExactActive
|
||||
'router-link-active-exact': props.exact && isExactActive
|
||||
}
|
||||
],
|
||||
icon: 'p-menuitem-icon',
|
||||
|
|
|
@ -45,11 +45,11 @@ const classes = {
|
|||
}
|
||||
],
|
||||
content: 'p-menuitem-content',
|
||||
action: ({ instance, isActive, isExactActive }) => [
|
||||
action: ({ props, isActive, isExactActive }) => [
|
||||
'p-menuitem-link',
|
||||
{
|
||||
'router-link-active': isActive,
|
||||
'router-link-active-exact': instance.exact && isExactActive
|
||||
'router-link-active-exact': props.exact && isExactActive
|
||||
}
|
||||
],
|
||||
icon: 'p-menuitem-icon',
|
||||
|
|
|
@ -99,11 +99,11 @@ const classes = {
|
|||
}
|
||||
],
|
||||
content: 'p-menuitem-content',
|
||||
action: ({ instance, isActive, isExactActive }) => [
|
||||
action: ({ props, isActive, isExactActive }) => [
|
||||
'p-menuitem-link',
|
||||
{
|
||||
'router-link-active': isActive,
|
||||
'router-link-active-exact': instance.exact && isExactActive
|
||||
'router-link-active-exact': props.exact && isExactActive
|
||||
}
|
||||
],
|
||||
icon: 'p-menuitem-icon',
|
||||
|
|
|
@ -68,11 +68,11 @@ const classes = {
|
|||
}
|
||||
],
|
||||
content: 'p-menuitem-content',
|
||||
action: ({ instance, isActive, isExactActive }) => [
|
||||
action: ({ props, isActive, isExactActive }) => [
|
||||
'p-menuitem-link',
|
||||
{
|
||||
'router-link-active': isActive,
|
||||
'router-link-active-exact': instance.exact && isExactActive
|
||||
'router-link-active-exact': props.exact && isExactActive
|
||||
}
|
||||
],
|
||||
icon: 'p-menuitem-icon',
|
||||
|
|
|
@ -47,10 +47,10 @@ const styles = `
|
|||
const classes = {
|
||||
root: 'p-tabmenu p-component',
|
||||
menu: 'p-tabmenu-nav p-reset',
|
||||
menuitem: ({ instance, index, item, isActive, isExactActive }) => [
|
||||
menuitem: ({ instance, props, index, item, isActive, isExactActive }) => [
|
||||
'p-tabmenuitem',
|
||||
{
|
||||
'p-highlight': (instance.exact ? isExactActive : isActive) || instance.d_activeIndex === index,
|
||||
'p-highlight': (props.exact ? isExactActive : isActive) || instance.d_activeIndex === index,
|
||||
'p-disabled': instance.disabled(item)
|
||||
}
|
||||
],
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div :class="cx('root')" v-bind="ptm('root')">
|
||||
<div :class="cx('root')" v-bind="ptm('root')" data-pc-name="tabmenu">
|
||||
<ul ref="nav" :class="cx('menu')" role="menubar" :aria-labelledby="ariaLabelledby" :aria-label="ariaLabel" v-bind="ptm('menu')">
|
||||
<template v-for="(item, i) of focusableItems" :key="label(item) + '_' + i.toString()">
|
||||
<router-link v-if="item.to && !disabled(item)" v-slot="{ navigate, href, isActive, isExactActive }" :to="item.to" custom>
|
||||
|
|
|
@ -67,11 +67,11 @@ const classes = {
|
|||
}
|
||||
],
|
||||
content: 'p-menuitem-content',
|
||||
action: ({ instance, isActive, isExactActive }) => [
|
||||
action: ({ props, isActive, isExactActive }) => [
|
||||
'p-menuitem-link',
|
||||
{
|
||||
'router-link-active': isActive,
|
||||
'router-link-active-exact': instance.exact && isExactActive
|
||||
'router-link-active-exact': props.exact && isExactActive
|
||||
}
|
||||
],
|
||||
icon: 'p-menuitem-icon',
|
||||
|
|
Loading…
Reference in New Issue