react 手写优化实现 antd 倒计时功能组件（附源码）

最新推荐文章于 2024-05-18 09:37:31 发布

大唐荣华

最新推荐文章于 2024-05-18 09:37:31 发布

阅读量951

点赞数 2

分类专栏：大前端文章标签： react.js javascript 前端倒计时 antd

本文链接：https://blog.csdn.net/weixin_40599109/article/details/122046491

版权

起因是因为PM觉得 antd 的倒计时组件丑，所以花了一点时间手写了一个这样样式的，希望能帮到需要的人。

原来antd ： 8天8时8分8秒>0天8时8分8秒>0天0时8分8秒>>0天0时0分8秒
此组件样式： 8天8时8分8秒>8时8分8秒>8分8秒>8秒

创作不易，点个赞收藏一下吧！！！

使用

import Countdown from './countdown'
   const translate = (time: any) => {
        let date = new Date(time);
        let Y = date.getFullYear() + '-';
        let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
        let D = date.getDate() + ' ';
        let h = date.getHours() + ':';
        let m = date.getMinutes() + ':';
        let s = date.getSeconds();
        return Y + M + D + h + m + s;
    }
     const deadtime = translate(endTime);
 return &#