此網站需要開啟JavaScript
JavaScript is required

Alert

警示與提醒類彈窗到處都會用,所以統一掛在 layout,透過 store 的 function 呼叫,不要在每一頁各放一份。

警示彈窗

CommonModalInfoAlert

components/Common/Modal/Info/Alert.client.vue

元件本身已經掛在 layouts 的 #modalsField 裡, 頁面只要從 store 拿 openAlertModal 來呼叫。

沒給 confirmText 時只是單純通知; 給了才會出現確認 / 取消按鈕。

三種常見用法

Props

名稱型別預設值說明
messageString''顯示的訊息
position'center' | 'buttomLeft''center'出現位置
autoCloseBooleanfalse是否自動關閉
alertIconString'alert'左側圖示
actionIconString''按鈕圖示
textSizeString'md'
confirmTextString''有值才會出現確認鈕
confirmFunctionnull
rejectTextString''
rejectFunctionnull

倒數提醒

CommonModalInfoTimeAlert

components/Common/Modal/Info/TimeAlert.vue

帶倒數計時,時間到自動關閉。 適合「登入即將逾時」這類有時效的提醒。

點開會開始倒數