TanStack Ranger v0

Auto

Framework

Version

Menu

開始使用

適配器

React Ranger
react

API 參考

範例

TanStack Ranger v0

Auto

Framework

Version

Menu

開始使用

適配器

React Ranger
react

API 參考

範例

On this page

自訂步長

範例

想直接查看實作方式嗎？請參考以下範例：

custom-steps

以下 API 說明將介紹如何使用 custom-steps 功能。

選項

steps

ts

steps: Array<number>

steps: Array<number>

自訂步驟的陣列。此設定會覆寫 stepSize

ticks

ts

ticks: Array<number>

ticks: Array<number>

自訂刻度 (ticks) 的陣列。此設定會覆寫 tickSize

API

getTicks

tsx

getTicks: () => ReadonlyArray<{value: number; key: number; percentage: number}>

getTicks: () => ReadonlyArray<{value: number; key: number; percentage: number}>

需渲染的刻度 (ticks)。每個 tick 包含以下屬性：

value: number - 要顯示的刻度數值
key: number - 刻度的鍵值 (key)
percentage: number - 刻度在範圍選擇器 (ranger) 上的百分比位置

Our Partners

Wow, it looks like you could be our first partner for this library! Chat with us!

由 TanStack Router 和 Vite 驅動的全文檔 SSR、流式傳輸、伺服器功能和更多功能 - 準備部署到您喜歡的託管提供商。

TanStackVirtual

在 TS/JS、React、Vue、Solid、Svelte、Lit 和 Angular 中以 60FPS 的速度僅虛擬化大型可滾動 DOM 節點的可見內容，同時保持對標記和樣式的 100% 控制。

Subscribe to Bytes

Your weekly dose of JavaScript news. Delivered every Monday to over 100,000 devs, for free.

Subscribe to Bytes

Your weekly dose of JavaScript news. Delivered every Monday to over 100,000 devs, for free.