注册发送手机短信
### 整体流程总结
1. 1.
用户点击"获取验证码"按钮触发 `sendSms` 函数
2. 2.
验证手机号格式和非空状态
3. 3.
禁用按钮并调用发送验证码API
4. 4.
启动倒计时（立即更新一次状态消除延迟）
5. 5.
倒计时结束后恢复按钮状态
6. 6.
异常情况下捕获错误并恢复按钮状态
<el-form-item prop="phonenumber"><el-row :gutter="10"><el-col :span="16"><el-inputv-model="registerForm.phonenumber"type="text"size="large"auto-complete="off"placeholder="手机号"style="width: 205px;"><template #prefix><svg-icon icon-class="phone" class="el-input__icon input-icon" /></template></el-input></el-col><el-col :span="8"><el-button type="primary" size="large" @click="sendSms" :disabled="sendCodeDisabled" style="width: 120px;">{{ sendCodeText }}</el-button></el-col></el-row></el-form-item>
const sendSms = async () => {// 验证手机号if (!registerForm.value.phonenumber) {ElMessage.error('请输入手机号')return}if (!/^1[3-9]\d{9}$/.test(registerForm.value.phonenumber)) {ElMessage.error('请输入正确的手机号格式')return}try {// 禁用按钮sendCodeDisabled.value = true// 调用发送验证码API/* const response = await sendCode(registerForm.value.phonenumber) */ElMessage.success('验证码发送成功')// 开始倒计时// 立即更新一次状态，消除首次延迟countdown.value--;sendCodeText.value = `${countdown.value}秒后重新获取`;const timer = setInterval(() => {if (countdown.value <= 1) {clearInterval(timer)sendCodeText.value = '获取验证码'countdown.value = 60sendCodeDisabled.value = false} else {countdown.value--sendCodeText.value = `${countdown.value}秒后重新获取`}}, 1000)} catch (error) {ElMessage.error(error.msg || '验证码发送失败，请稍后重试')sendCodeDisabled.value = false}2.2 发送验证码流程
1. 1.
禁用按钮防止重复点击 ： sendCodeDisabled.value = true
2. 2.
调用发送验证码API ：（当前代码注释掉，实际项目中需取消注释）
1. 3.
显示成功提示 ： ElMessage.success('验证码发送成功') 2.3 倒计时实现（解决首次延迟问题）
// 立即更新状态，消除首次延迟
countdown.value--;
sendCodeText.value = `${countdown.value}秒后重新获取`;// 启动定时器
const timer = setInterval(() => {if (countdown.value <= 1) {// 倒计时结束，重置状态clearInterval(timer)sendCodeText.value = '获取验证码'countdown.value = 60sendCodeDisabled.value = false} else {// 更新倒计时countdown.value--sendCodeText.value = `${countdown.value}秒后重新获取`}
}, 1000)
const sendCodeDisabled = ref(false) // 控制按钮禁用状态
const countdown = ref(60) // 倒计时秒数
const sendCodeText = ref('获取验证码') // 按钮显示文本