Components

ScrollArea 滚动区

自定义纤细滚动条的受限视口，深浅色自动适配。

节点列表

max-height 接受任意 CSS 长度。

hkg-edge-01健康

nrt-edge-02健康

sjc-edge-03健康

fra-edge-04维护

sin-edge-05健康

iad-edge-06健康

gru-edge-07健康

syd-edge-08维护

nrt-edge-09健康

hkg-edge-10健康

<ScrollArea max-height="12rem" class="max-w-sm">
  <div class="space-y-1 pr-3">
    <div v-for="(node, i) in nodes" :key="node" class="flex items-center justify-between rounded-lg px-3 py-2 text-sm ring-1 ring-inset ring-slate-200/70 dark:ring-slate-800/70">
      <span class="font-mono text-xs text-slate-700 dark:text-slate-300">{{ node }}</span>
      <Badge :color="i % 4 === 3 ? 'warning' : 'success'" variant="soft" size="xs">{{ i % 4 === 3 ? '维护' : '健康' }}</Badge>
    </div>
  </div>
</ScrollArea>

API 参考

属性	类型	默认值	说明
`max-height`	`string`	`18rem`	视口最大高度。