element-plus 倒計(jì)時(shí)el-countdown添加背景色
效果圖:

實(shí)現(xiàn)方法:
<el-countdown :time="countdownTime" :formatter="formatter" /> <div v-html="formattedTime"></div>
formatter(time) { const days = Math.floor(time / 1000 / 60 / 60 / 24); // 計(jì)算天數(shù) const hours = Math.floor((time / 1000 / 60 / 60) % 24); // 計(jì)算小時(shí) const minutes = Math.floor((time / 1000 / 60) % 60); // 計(jì)算分鐘 const seconds = Math.floor((time / 1000) % 60); // 計(jì)算秒 // 更新 formattedTime 以便在 v-html 中使用 this.formattedTime = ` <span class="countdown-item days">${days}天</span> <span class="countdown-item hours">${String(hours).padStart(2, '0')}</span>: <span class="countdown-item minutes">${String(minutes).padStart(2, '0')}</span>: <span class="countdown-item seconds">${String(seconds).padStart(2, '0')}</span> `; return `${days}天 ${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`; // 返回字符串以滿(mǎn)足 formatter 的要求 },

浙公網(wǎng)安備 33010602011771號(hào)