Package Exports

image-verification-rotation
image-verification-rotation/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (image-verification-rotation) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Welcome to use the rotating image verification code component. This component is written for React

Parameter Introduction

interface ImageVerificationProps {
  src?: string
  offsetAngleTemp?: number
  onSuccess?: Function
  onFailer?: Function
  imgShow?: boolean
  width?: number
  height?: number
  imgWidth?: number
  deviationAngle?: number
}

The above are optional parameters

src is the address of the rotated image. If it is not passed in, use the image link I provided
offsetAngleTemp is the initial angle. You can provide the initial angle yourself or use the built-in random angle without passing in this parameter
onSuccess is a method that triggers when validation passes
onFailer is a method that triggers when validation fails
imgShow is a boolean value that displays the original image when it is true, and not when it is false
width is the width of the component
height is the height of the component
imgWidth is the width and height of the image
deviationAngle is the deviation value of the verification angle, with a default deviation of 5 degrees
successText is the copy that has been successfully verified
failText is the copy that failed validation
initText is the prompt text
customButton allows you to customize the style of the reset button by defining an element and passing it in

Use

you can use

npm install image-verification-rotation

yarn add image-verification-rotation

This library uses the ES6 module export, so when used

import Verification from 'image-verification-rotation'

There is already a. dts declaration file in the file, so there is no need to import @ types/image verification annotation
use

<Verification  />
// or
<Verification src="url" onSuccess={your function}  />

Example

<Verification
  src="xxx"
  onSuccess={() => console.log('success')}
  onFailer={() => console.log('failer')}
  imgShow={false}
  offsetAngleTemp={54}
  deviationAngle={10}
  ......
/>