搬运 NiceForm 组件2

package.json

@@ -47,6 +47,7 @@
     "lint-staged": "^10.0.7",
     "mobx": "^5.15.4",
     "mobx-react": "^6.2.2",
+    "pinyin": "^2.9.1",
     "prettier": "^1.19.1",
     "query-string": "^6.13.1",
     "react": "^16.12.0",
@@ -65,4 +66,4 @@
     "ora": "^4.0.4",
     "typescript": "^3.9.7"
   }
-}
\ No newline at end of file
+}

src/app.tsx

@@ -12,6 +12,8 @@ import { getAuth, setAuth, setRouters, removeAuth, removeRouters, asyncRouter, g
 import { PublicApi } from './services/api';
 import { isDev } from './constants';
 import queryString from 'query-string';
+// 全局注册虚拟组件
+import '@/components/NiceForm/public'
 
 setup();
 let extraRoutes: never[] = [];

src/components/NiceForm/components/DateSelect.tsx

@@ -17,7 +17,6 @@ const getPrevTime = (num, flag) => {
 
 const DateSelect = (props) => {
   const { value = [], mutators } = props
-  console.log('value', value)
   const todayStartTime = moment().startOf('day').format('x')
   const nowTime = moment().format('x').valueOf()
   const dateMemo = useMemo(() => [

src/utils/hooks/index.ts

+import React, { useState, useEffect } from 'react'
+export interface UseCountDownProps {
+  maxTime: number,
+  minTime: number,
+  initText: React.ReactNode,
+  delay: number,
+  onEnd(): void,
+  decayRate: number
+}
+
+export interface ReturnValue {
+  start(): void,
+  text: React.ReactNode,
+  isActive: boolean
+}
+
+const useCountDown = (options: UseCountDownProps): ReturnValue => {
+  const [activeText, setActiveText] = useState(options.initText)
+  const [isOpen, setIsOpen] = useState(false)
+
+  useEffect(() => {
+    const { maxTime = 60, minTime = 0, initText = '获取验证码', delay = 1 * 1000, onEnd = () => {}, decayRate = 1 } = options
+    let activeInterval: any = null
+    let activeTime = maxTime
+    if (isOpen) {
+      activeInterval = setInterval(() => {
+        if (activeTime === minTime) {
+          setActiveText(initText)
+          setIsOpen(false)
+          clearInterval(activeInterval)
+          onEnd && onEnd()
+        } else {
+          setActiveText((activeTime -= decayRate) + 's')
+        }
+      }, delay)
+    }
+    return () => {
+      clearInterval(activeInterval)
+    }
+  }, [isOpen])
+
+  function start() {
+    if (isOpen) {
+      return false
+    }
+    setIsOpen(true)
+    setActiveText(options.maxTime + 's')
+  }
+  return {
+    start,
+    text: activeText,
+    isActive: isOpen
+  }
+}
+
+export default useCountDown
\ No newline at end of file