使用vant提供函数调整倒计时

@@ -22,9 +22,11 @@
           <van-field v-model="code" center clearable name="code" label="短信验证码" placeholder="请输入短信验证码"
           <van-field v-model="code" center clearable name="code" label="短信验证码" placeholder="请输入短信验证码"
             :formatter="formatter" :rules="[{ required: true, message: '请填写验证码' }]">
             :formatter="formatter" :rules="[{ required: true, message: '请填写验证码' }]">
             <template #button>
             <template #button>
-              <van-button @click="sendCode" size="small" type="primary" :disabled="disabled">
-                <span v-if="countDown === 60">发送验证码</span>
-                <span v-else>{{ countDown }} 秒重新发送</span>
+              <van-button @click="sendCode" v-if="countDown.current.value.total === limit" size="small" type="primary" :disabled="disabled">
+                <span>发送验证码</span>
+              </van-button>
+              <van-button v-else size="small" type="primary" :disabled="disabled">
+                <span>{{ countDown.current.value.seconds }} 秒重新发送</span>
               </van-button>
               </van-button>
             </template>
             </template>
           </van-field>
           </van-field>
@@ -46,6 +48,9 @@ import { useRoute, useRouter } from 'vue-router'
 import axios from '@/utils/axios'
 import axios from '@/utils/axios'
 import logo_image from '@images/zhengshu-banner@2x.png'
 import logo_image from '@images/zhengshu-banner@2x.png'
 import { wxInfo } from '@/utils/tools';
 import { wxInfo } from '@/utils/tools';
+
+import { useCountDown } from '@vant/use';
+
 const $route = useRoute();
 const $route = useRoute();
 const $router = useRouter();
 const $router = useRouter();
 
 
@@ -104,20 +109,32 @@ const onBlur = () => { // 数字键盘失焦回调
 };
 };
 
 
 // 设置发送短信倒计时
 // 设置发送短信倒计时
-const countDown = ref(60);
-const countDownHandle = () => {
-  // 倒计时
-  if (countDown.value === 0) {
-    countDown.value = 60;
-  } else {
-    countDown.value--;
-    setTimeout(() => {
-      countDownHandle()
-    }, 1000)
+// const countDown = ref(60);
+// const countDownHandle = () => {
+//   // 倒计时
+//   if (countDown.value === 0) {
+//     countDown.value = 60;
+//   } else {
+//     countDown.value--;
+//     setTimeout(() => {
+//       countDownHandle()
+//     }, 1000)
+//   }
+// }
+
+// 设置发送短信倒计时
+// TAG: vant 自带倒计时函数
+const limit = ref(60000); // 配置倒计时秒数
+const countDown = useCountDown({
+  // 倒计时 24 小时
+  time: limit.value,
+  onFinish: () => {
+    countDown.reset();
   }
   }
-}
+});
+
 const sendCode = () => { // 发送验证码
 const sendCode = () => { // 发送验证码
-  if (countDown.value === 60) {
+  countDown.start();
   // TODO: 验证码接口
   // TODO: 验证码接口
   axios.post('/srv/?a=bind_phone&t=get_code', {
   axios.post('/srv/?a=bind_phone&t=get_code', {
     phone: phone.value
     phone: phone.value
@@ -125,7 +142,6 @@ const sendCode = () => { // 发送验证码
     .then(res => {
     .then(res => {
       if (res.data.code === 1) {
       if (res.data.code === 1) {
         Toast.success('发送成功');
         Toast.success('发送成功');
-          countDownHandle()
       } else {
       } else {
         console.warn(res.data);
         console.warn(res.data);
         Toast({
         Toast({
@@ -137,7 +153,6 @@ const sendCode = () => { // 发送验证码
     .catch(err => {
     .catch(err => {
       console.error(err);
       console.error(err);
     })
     })
-  }
 };
 };
 
 
 const disabled = ref(true);
 const disabled = ref(true);