1.0.6 • Published 7 years ago

vue-drag-verify v1.0.6

Weekly downloads
218
License
-
Repository
-
Last release
7 years ago

vue-drag-verify NPM version

This is a vue component, which is sliding to unlock for login or sign up. This is used to protect your web app from bot attack. demo

Installation

 npm install vue-drag-verify --save

Usage

<drag-verify :width="width" 
			 :height="height" 
			 :text="text" 
			 :success-text="successText" 
			 :background="background" 
			 :progress-bar-bg="progressBarBg" 
			 :completed-bg="completedBg" 
			 :handler-bg="handlerBg" 
			 :handler-icon="handlerIcon" 
			 :text-size="textSize" 
			 :success-icon="successIcon" 
			 :circle="getShape"></drag-verify>
import Vue from 'vue'
import dragVerify from 'vue-drag-verify'

export default {
  name: 'app',
  components:{
    dragVerify
  }
}

Props

PropertyTypeDefaultDescription
widthNumber200The width of the component
heightNumber60The height of the component
textStringswiping to the right sideThe text shows on the component
successTextStringsuccessThe text shows when it’s successful
backgroundString#cccThe background color of the component
colorString#ffffffThe color of the text
progressBarBgString#FFFF99The backgound color of the progress bar
completedBgString#66cc66The backgound color of the component when the button dragged to the right side
circleBooleantrueIf true, the shape of component is round
handlerIconString-The icon of handler
successIconString-The icon of handler when the button dragged to the right side
handlerBgString#fffThe background color of the handler
textSizeString20pxFont size of prompt message