Switch 開關

兩種狀態的切換,切了立即生效。使用 Element Plus 的 el-switch。

設計準則

• 和 Checkbox 的分工:切換立即生效 → Switch;要按儲存才生效 → Checkbox
• 開 = 正向、期望的狀態(「啟用」「接收通知」);不要讓「開」代表關閉某功能
• 切換後要等後端回應時用 loading,避免使用者重複點
• 有風險的切換(停用整個活動)不要直接生效,搭配二次確認(before-change 彈確認框)
• 開關本身只有兩態,不要拿來做「男/女」這種選項切換(用 Radio)

基本用法

loading

附文字

文字放外側描述開關管什麼;內側文字(inline-prompt)只放一個字:

loading

載入與禁用

loading

Do / Don't

✅ Do	❌ Don't
立即生效才用 switch	表單裡要按儲存的用 switch(用 checkbox)
開 = 正向狀態	開 =「停用通知」
危險切換加二次確認	一滑就停用整個活動
兩種狀態(開/關)	拿來切「男/女」(用 radio)

給工程師

完整 API 見 Element Plus Switch 文件。 本站規範優先於 EP 文件中的視覺建議。