滑块式验证码 uni插件

快速开始

npm安装

npm i slider_ccaptcha_fhlt

引入组件

<script>
    import sliderCaptcha from 'slider_ccaptcha_fhlt/sliderCaptcha.vue'
    
    export default {
		components: {
			sliderCaptcha
		},
		...
	
	}
</script>

配置appkey

<script>
   data() {
   	return {
   		appkey: 'qscms',
   	}
   },
</script>

使用

<template>
	<view class="content">
		<button @click="open">打开验证</button>

		<sliderCaptcha ref="captcha" :appkey="appkey" closeable closeOnClickOverlay :overlayOpacity="0.3"
			:channelText="'滑动完成验证'" endToStart >
		</sliderCaptcha>
	</view>
</template>

method

	methods: {
		    open() {
		    	this.$refs.captcha.show(res=>{
			    	if(res.code==200){
			    	uni.showToast({
			    		title: '验证通过' + res.data.ticket,
			    		duration: 2000
			    	});
			    	}
		    	});
		    }
		    ...
		}

示例

<template>
	<view class="content">
		
		<button @click="open">打开验证</button>

		<sliderCaptcha ref="captcha" :appkey="appkey" closeable closeOnClickOverlay
			:channelText="'滑动完成验证'" endToStart  >
		</sliderCaptcha>
	</view>
</template>

<script>
	import sliderCaptcha from 'slider_ccaptcha_fhlt/sliderCaptcha.vue'
	export default {
		components: {
			sliderCaptcha
		},
		data() {
			return {
				appkey: 'qscms',
			}
		},
		onLoad() {

		},
		methods: {
			open() {
				this.$refs.captcha.show(res=>{
			    	if(res.code==200){
			    	uni.showToast({
			    		title: '验证通过' + res.data.ticket,
			    		duration: 2000
			    	});
			    	}
				});
			}
		}
	}
</script>