diff --git a/src/views/profile/personalCenter/index.vue b/src/views/profile/personalCenter/index.vue index e63d953..fb08bfd 100644 --- a/src/views/profile/personalCenter/index.vue +++ b/src/views/profile/personalCenter/index.vue @@ -208,7 +208,7 @@ const phoneCaptchaState = initCaptchaState('phone'); const emailCaptchaState = initCaptchaState('email'); const showPwdSendButton = ref(true); -const pwdSendState = ref({ isCounting: false, countdown: 0 }); +const pwdSendState = reactive({ isCounting: false, countdown: 0 }); const pwdMobileCaptchaState = initCaptchaState('phone'); const pwdEmailCaptchaState = initCaptchaState('email'); @@ -458,9 +458,28 @@ const handleSendPwdCaptcha = async () => { const updatePwdSendState = () => { const t = passwordForm.verifyType === 'email' ? pwdEmailCaptchaState : pwdMobileCaptchaState; - pwdSendState.value = { isCounting: t.isCounting.value, countdown: t.countdown.value }; + pwdSendState.isCounting = t.isCounting.value; + pwdSendState.countdown = t.countdown.value; }; +// 监听倒计时状态变化(实时同步到UI) +watch( + () => pwdMobileCaptchaState.countdown.value, + () => { + if (passwordForm.verifyType === 'mobile') { + updatePwdSendState(); + } + } +); +watch( + () => pwdEmailCaptchaState.countdown.value, + () => { + if (passwordForm.verifyType === 'email') { + updatePwdSendState(); + } + } +); + // 提交修改密码 const handlePasswordConfirm = async () => { if (!passwordFormRef.value) return; diff --git a/src/views/user/components/Captcha.vue b/src/views/user/components/Captcha.vue index ae586d9..a7ce534 100644 --- a/src/views/user/components/Captcha.vue +++ b/src/views/user/components/Captcha.vue @@ -49,6 +49,8 @@ const countdown = ref(0) watch( () => props.sendState, (newVal) => { + console.log('监听 倒数 变化'); + isCounting.value = newVal.isCounting countdown.value = newVal.countdown },