uniapp手机号验证码登录倒计时60秒代码

以下是一个基于uni-app的手机号验证码登录倒计时60秒的代码示例：

HTML代码：

<template>
  <view>
    <input type="tel" placeholder="请输入手机号" v-model="mobile" />
    <input type="tel" placeholder="请输入验证码" v-model="code" />
    <button :disabled="isDisabled" @click="sendCode">{{ countdown }}</button>
    <button @click="login">登录</button>
  </view>
</template>

JS代码：

<script>
export default {
  data() {
    return {
      mobile: '',
      code: '',
      countdown: '获取验证码',
      isDisabled: false,
      timer: null,
    };
  },
  methods: {
    // 发送验证码
    sendCode() {
      // 在此处编写发送验证码的逻辑，省略实现
      // 发送成功后开始倒计时
      this.startCountdown();
    },
    // 开始倒计时
    startCountdown() {
      let count = 60;
      this.countdown = `${count}秒后重新获取`;
      this.isDisabled = true;
      this.timer = setInterval(() => {
        count--;
        if (count <= 0) {
          clearInterval(this.timer);
          this.timer = null;
          this.countdown = '获取验证码';
          this.isDisabled = false;
        } else {
          this.countdown = `${count}秒后重新获取`;
        }
      }, 1000);
    },
    // 登录
    login() {
      // 在此处编写登录的逻辑，省略实现
    },
  },
};
</script>

在上面的代码中，我们定义了一个 `countdown` 变量用于显示倒计时的时间，`isDisabled` 变量用于判断获取验证码按钮是否可用，`timer` 变量用于存储定时器 ID。

在 `sendCode` 方法中，先省略发送验证码的逻辑，然后在发送成功后调用 `startCountdown` 方法开始倒计时。

`startCountdown` 方法中，我们使用 `setInterval` 函数每隔一秒更新倒计时的时间，当倒计时为 0 时清除定时器并重置倒计时的时间和按钮状态。

最后，在 `login` 方法中编写登录的逻辑即可。