0.3.0 • Published 3 years ago
vue-captcha-code-alpha v0.3.0
vue-captcha-code-alpha
install
yarn add vue-captcha-code-alphafor vue3 use

usage
<script setup>
import { CaptchaImage } from 'vue-captcha-code-alpha'
import 'vue-captcha-code-alpha/style.css'
import type { CaptchaImageInstance } from 'vue-captcha-code-alpha'
const captchaRef = ref<CaptchaImageInstance>()
const validate = () => {
captchaRef.value.validate("1234")
}
</script>
<template>
<CaptchaImage ref="captchaRef"/>
</template>props
| Name | Type | Default | Desp |
|---|---|---|---|
| codeLength | Number | 4 | length of verification code |
| codeType | String[] | "A", "a", "0" | type of verification code A A-Z / a a-z / 0 0-9 |
| contentWidth | Number | 120 | captcha width |
| contentHeight | Number | 40 | captcha height |
| fontSizeMin | Number | 24 | minimum font size |
| fontSizeMax | Number | 36 | maximum font size |
| textColor | String | null | specify text color |
| textColorMin | Number | 50 | minimum text color |
| textColorMax | Number | 160 | maximum text color |
| textDegMin | Number | -30 | minimum text rotation |
| textDegMax | Number | 30 | maximum text rotation |
| backgroundColor | String | null | specify background color |
| backgroundColorMin | Number | 200 | minimum background color |
| backgroundColorMax | Number | 220 | maximum background color |
| dotCount | Number | 30 | specify dot count |
| dotColorMin | Number | 0 | minimum dot color |
| dotColorMax | Number | 255 | maximum dot color |
| lineCount | Number | 4 | specify line count |
| lineColorMin | Number | 40 | minimum line color |
| lineColorMax | Number | 180 | maximum line color |