if-verify

登录验证

Install

npm install if-verify

yarn add if-verify

Import JS and Styles

import * as Verify from 'if-verify'
import 'if-verify/dist/if-verify.css'

Basic usage

<Verify
  @success="success"
  :imgSize="{ width: '330px', height: '155px' }"
  :getUrl="getUrl"
  :checkUrl="checkUrl"
  ref="verify"
></Verify>

Props

Name | Type | Required | Default | Desc | ------------------------|----------|------------|-----------------------------|------ | verifyType | string | no | blockPuzzle(滑块 | 点选) | blockPuzzle | clickWord imgSize | object | no | {width:'400px',height:'200px'} | mode | string | no | pop | getUrl | string | yes | | 获取验证背景图 checkUrl | string | yes | | 验证成功后拿到token gateway | string | yes | | 网关/域名 isShow | boolean | no | false |

Events

Name | Desc |
-----------|----------------------- | success | 参数为成功后拿到得token

Example

<Button @click='handleShow'>点击显示验证码</Button>
<Verify
  @success="success"
  :isShow="isShow"
  :imgSize="{ width: '330px', height: '155px' }"
  :getUrl="'/uc/api/captcha/get'"
  :checkUrl="'/uc/api/captcha/check'"
  :gateway="*******"
  ref="verify"
/>
<script lang='ts'>
import Verify from 'if-verify'
import 'if-verify/dist/if-verify.css'
setup(props) {
   const isShow = ref<boolean>(false)
   const handleShow = () => {
    isShow.value ? isShow.value = false : isShow.value = true
   }
   const success = (token) => {
    console.log(token)
   }
   return {
    handleShow,
    success
   }
}
</script>