Skip to content

大纲

@astryxdesign/core v0.7.1 · Outline

属性 ​

属性类型默认值说明
itemsOutlineItem[]—按顺序排列的标题。每一项是 { id, label, level }。level 为 1–6。
activeIdstring—受控的当前标题。一旦传入,内置滚动侦测关闭。用 v-model:active-id 绑定。
labelstringTable of contents导航地标的无障碍名称。默认文案随语言变化,中文为「目录」。
density'default' | 'compact''default'条目内边距。compact 用于密集侧栏。
offsetnumber0盖住滚动容器顶部的固定头高度,单位像素。停留线和滚动落点一起下移。
scrollContainerHTMLElement | null—要跟踪的滚动容器。不传则用最近的可滚动祖先,没有就用视口。
hasScrollOnClickbooleantrue激活一项时是否平滑滚到对应标题。

事件 ​

事件参数说明
update:activeIdstring当前 id 变了。来源是滚动侦测,或读者激活了某一项。
navigateStartstring一次点击开始滚向这个 id。
navigateEndstring这次导航结束、被打断,或到了 1.2 秒。每次开始只发一次。

主题 ​

根类名是 astryx-outline。指示条读取 --astryx-outline-indicator-top 和 --astryx-outline-indicator-height,组件会按当前链接量出来。

缩进是 2px 的轨道,加上行内起始内边距:第一档为间距 3,然后是间距 7、间距 11、间距 12。compact 把块方向内边距从间距 2 改成间距 1。