免費線上計數器

工作原理

此計數器完全在你的瀏覽器中執行，使用 React 狀態和瀏覽器內建的 localStorage API——沒有伺服器、沒有帳號，也不會傳送任何資料。計數在頁面重新整理後自動保留，全螢幕模式使用 Screen Wake Lock API 在計數時保持螢幕常亮。

1. 1
   狀態儲存在 localStorage 中

   頁面載入時，工具會從 localStorage 的固定鍵中讀取之前儲存的計數器。每個計數器——標籤、當前值、步長和是否允許負數——都會序列化為 JSON，並在每次更改時寫回 localStorage，因此即使意外關閉或重新整理標籤頁，計數也不會丟失。
2. 2
   透過 React 狀態增減計數

   點選 + 或中央的大按鈕會呼叫更新函式，將設定的步長加到計數器當前值上。如果關閉了允許負數，結果會透過 Math.max 限制為不小於零。鍵盤快捷鍵（空格/+ 增加，-/Backspace 減少）透過 window 的 keydown 監聽器作用於當前啟用的計數器。
3. 3
   帶 Screen Wake Lock 的全螢幕模式

   進入全螢幕模式後會顯示一個覆蓋層，整個螢幕都是點選區域。同時，工具透過 navigator.wakeLock.request('screen') 請求喚醒鎖——這是一個請求作業系統阻止螢幕休眠的瀏覽器 API。標籤頁從後台恢復可見時，會自動重新取得喚醒鎖。
4. 4
   多個計數器與合計

   新增第二個計數器會建立一個新條目，其 ID 由 crypto.randomUUID() 產生。存在多個計數器時，會將所有值相加計算合計，並顯示在計數器列表上方。每個計數器都有獨立的步長、重設和允許負數設定。

相關工具