??, ????? ??? ?? ???, ?? ?? ?? ??? ??? ?? ?? ?? ??? ??????! ? ? ??? ?? ????? ???? ?????? ?? ?????? ?? ? ??? ?????. ??? ? ?? ?? ? ?????? ????? ??? ??? ??????. ? ??? ??? ?? ?? ????? ????!

? alovajs: ?? ??? ???? ?

???? ?? ??? ??? alovajs?? ??? ??? ???? ?? ? ????. alovajs? ?? ????? ???? ?? ??? ?? ???? openapi ?? ???? ???? ??? ?? ?????.

??? alovajs? ??? ??? ?? ????(https://alova.js.org)? ??? ??? ????. ???? ??? ??? ??? ?? ??? ?? ???? ?????! ? ? ?? ?? ?? ??: ?????? ???

?? alovajs? ???? ?? ??? ???? ??? ???????. ???? ?? ???? ?? ??? ???! ?

?? alovajs?? useCaptcha? ???? ???.

??? ??? ?? ??? ? ????.

import { useCaptcha } from 'alova/client';

????? ??? ?????! ? useCaptcha? ??? ?? ??? ?? ????? ???? ???? ??? ? ????. ? ??? ???? ?? ??? ??? ?? ?, ?? ??? ??? ???? ? ? ?? ??? ?????. ? ? ?? ????? ??? ??? ????? ??? ? ?????! ?

<template>
  <input v-model="mobile" />
  <button
    @click="sendCaptcha"
    :loading="sending"
    :disabled="sending || countdown > 0">
    {{ loading ? '發(fā)送中...' : countdown > 0 ? `${countdown}后可重發(fā)` : '發(fā)送驗(yàn)證碼' }}
  </button>
</template>

<script setup>
  import { ref } from 'vue';
  import { apiSendCaptcha } from './api.js';
  import { useCaptcha } from 'alova/client';

  const mobile = ref('');
  const {
    // 發(fā)送狀態(tài)
    loading: sending,

    // 調(diào)用sendCaptcha才會(huì)請(qǐng)求接口發(fā)送驗(yàn)證碼
    send: sendCaptcha
  } = useCaptcha(() => apiSendCaptcha(mobile.value));
</script>

????? ??? ?????? ?? ???? ????.

alovajs? ???? ?? ??? ???? ??? ??? ????? ?? ??????.

useCaptcha(() => apiSendCaptcha(mobile.value), {
  // ...
  // highlight-start
  // Set the countdown to 20 seconds
  initialCountdown: 20
  // highlight-end
});

? ?? ???? ???? ?? API? ??? ?? ??? ??? ???? ???? ?? ??? ?? ?????. ?? ??? ????? ??? ?? ????? ?????! ?

? ?? ? ??

alovajs ?? ?? ?? ??? ?? ??? ??? ?????.

1. ???? ???? ?? API: ?? JavaScript ??? ???? ??? ????? ?????. ?
2. ?? ?? ??: ? ?? ?? ?? ??? ?? ???? ???. ?
3. ??? ??? ???: ???? ??? ??? ??? ????? ?? ?????. ?

??? ??? ???? ?? ?? ??? ???? ?? ???? ??? ? ??? ? ????. ??? ???, alovajs? ???? ?? ?? ??? 30% ??? ??? ? ???! ?

??? ?? ?? alovajs? ???? ?? ???? ?????? ??? ?? ?? ??? ????? ???? ???? ???? ??? ????. ? ??, "??" ?? ?? "??"? ?? ??? ??? ? ??? ? ? ???? ???? ? ??? ? ? ????.

?? ??? ???, ??? ??? ????? ??? ? ?? ???? ????? alovajs? ??? ??? ???? ??????? ??? ??? ?? ????? ??? ???? ????? ??? ???? ??? ???. ?? ???? ???? ? ?? ??? ??? ??? ???! ?

? ??? ??? ???? ???? ?????. ? ???? ??? ?? ?? ??? ? ?? ??????! ????? ??? ?? ??? ????? ???? ?????! ?

? ??? ?? ??? ?????? ? ??? ??? ?? ?? ???? ? ?? ?????.? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!