1. 新增：每次调用渲染的间隔时间（ms）

2. 所有时间都从秒改为毫秒
realgeoffrey · Apr 13, 2023 · 75e332b · 75e332b
1 parent 0c2325f
commit 75e332b
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 17 deletions.
diff --git a/demo/index.html b/demo/index.html
@@ -12,7 +12,7 @@
     <script src="//unpkg.com/babel-standalone@6/babel.min.js"></script>
 
     <script src="//unpkg.com/react-time-countdown"></script>
-    <!-- <script src="../dist/react-time-countdown.umd.production.min.js"></script> -->
+    <!--<script src="../dist/react-time-countdown.umd.production.min.js"></script>-->
 
     <script type="text/babel">
       const TimeCountdown = window['react-time-countdown'].default;
@@ -23,7 +23,6 @@
         return (
           <div>
             <h3>倒计时</h3>
-
             <TimeCountdown
               deadlineTimestamp={deadline}
               callback={() => {
@@ -45,9 +44,8 @@ <h3>倒计时</h3>
               }}
               intervalDelay={1000}
             />
-
+            毫秒
             <hr />
-
             <div>
               设置结束时间戳：
               <div

diff --git a/src/index.tsx b/src/index.tsx
@@ -1,5 +1,5 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { SET_INTERVAL, GET_REST_TIME } from './utils';
+import React, { useEffect, useRef, useState } from "react";
+import { SET_INTERVAL, GET_REST_TIME } from "./utils";
 
 interface PropsType {
   deadlineTimestamp: number; // 结束时间戳
@@ -12,20 +12,20 @@ interface PropsType {
   intervalDelay?: number; // 每次调用渲染的间隔时间（毫秒，默认：1000）
 }
 
-export const Thing = function (props: PropsType) {
+export const Thing = function(props: PropsType) {
   const {
     deadlineTimestamp,
     leftMillisecond: _leftMillisecond = 0,
     callback,
     renderMillisecond,
-    intervalDelay = 1000,
+    intervalDelay = 1000
   } = props;
 
   const leftMillisecond = Math.max(_leftMillisecond, 0);
 
   // 每秒执行（实例）
-  const setIntervalInstance = useRef<SET_INTERVAL | { stop: Function }>({
-    stop: () => {},
+  const setIntervalInstance = useRef<SET_INTERVAL>({
+    stop: () => {}
   });
 
   useEffect(() => {
@@ -53,13 +53,9 @@ export const Thing = function (props: PropsType) {
     };
   }, [deadlineTimestamp, leftMillisecond, callback, intervalDelay]);
 
-  const [restTotalSecond, setRestTotalSecond] = useState<number>(
-    GET_REST_TIME(deadlineTimestamp)
-  );
+  const [restTotalSecond, setRestTotalSecond] = useState<number>(GET_REST_TIME(deadlineTimestamp));
 
-  return renderMillisecond
-    ? renderMillisecond(restTotalSecond)
-    : restTotalSecond;
+  return <>{renderMillisecond ? renderMillisecond(restTotalSecond) : restTotalSecond}</>;
 };
 
 export default Thing;
diff --git a/src/utils.ts b/src/utils.ts
@@ -4,7 +4,7 @@ export class SET_INTERVAL {
 
   constructor(func: Function, millisecond: number) {
     let setIntervalId: ReturnType<typeof setTimeout>;
-    if (typeof func === 'function') {
+    if (typeof func === "function") {
       setIntervalId = setTimeout(function self() {
         setIntervalId = setTimeout(self, millisecond);
         func();