Skip to content

顶部导航项

@astryxdesign/core v0.7.1 · TopNavItem

属性 ​

属性类型默认值说明
labelstring—这条导航的名字,默认显示成可见文字。打开 isIconOnly 后改成读屏用的 aria-label。必填。
hrefstring—要跳去的地址。
asNavLinkComponent'a'链接换成别的根组件时用,例如 RouterLink,它还会一并收到 to。只有写了地址才会用到。
targetstring—链接的 target。指明在新窗口打开时,会自己补上 noopener noreferrer。
relstring—链接的 rel。和上面自动补的 noopener noreferrer 合并,不会互相顶掉。
iconClassstring—文字前面那个图标,传 CSS icon 的类名,例如 i-carbon-home。
isSelectedbooleanfalse是不是当前这一页。会写上 aria-current="page",并套上选中样式。
isDisabledbooleanfalse禁用这一项。会写上 aria-disabled,去掉 href 和 target,让它既跳不走也点不动。
isIconOnlybooleanfalse只显示图标,做成一个方形的按钮,文字收进 aria-label。收进移动端抽屉时文字会重新显示出来。
sizeNavItemSize'md'这一项的高和左右内边距:'sm' 是 28px,'md' 是 32px,'lg' 是 36px。

事件 ​

  • click(event: MouseEvent):点击时触发。禁用的项会先挡掉默认行为,也不会触发事件。