分享一个用于登陆验证的vue组件

FWHeart 发布于2019-08-21 17:27 / 1964人阅读

这是一个基于vue2的验证组件--vue-drag-verify。用于登陆或者注册等。可以自定义背景色和字体以及形状等属性。

这里是Demo

安装

通过npm安装

npm install vue-drag-verify --save

插件应用

import Vue from "vue"
import dragVerify from "vue-drag-verify"

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

组件参数

名称 | 类型 | 默认值 | 说明
--- | --- | --- | ---
width | Number | 200 | 组件的宽度
height | Number | 60 | 组件的高度
text | String | swiping to the right side | 提示信息文字
successText | String | success | 验证通过时的提示信息文字
background | String | #ccc | 组件背景色
color | String | #ffffff | 组件文字颜色
progressBarBg | String | #FFFF99 | 拖拽过程中的背景颜色
completedBg | String | #66cc66 | 验证成功的背景颜色
circle | Boolean | true | 设为true,组件为圆形按钮，否则为长方形
handlerIcon | String | - | 拖拽按钮的icon
successIcon | String | - | 验证通过时拖拽按钮的icon
handlerBg | String | #fff | 拖拽按钮的背景色
textSize | String | 20px | 组件的文字大小

推荐一个找vue,angular组件的轮子工厂

云服务器私有云 vue组件 vue组件开发 vue父子组件通讯 vue轮播组件

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/89529.html

基于 Vue 的后台管理系统前端实践

摘要：输入框内容过滤产品有一个需求是，在搜索用户信息时，只能通过邮箱搜索，并且只能输入字母数字以及。我选择了输入框的值这里的坑就是需要在中更新值，因为元素这时才刷新。是否有一定要用的必要类似的管理系统涉及到不同页面之间的交互都很少。初始化项目使用 Vue-cli3 初始化项目1 安装 Element UI安装 Vue-i18n，做相关配置2,3 原则上需要对 Element 也做 I18...

scwang90 2019-08-23 12:13 评论0 收藏0
vue2 + vuex 高度还原饿了么 App，与官方后台真实数据交互，获取商品信息，实现登陆、购

摘要：注此项目纯属个人瞎搞，正常下单请选择饿了么官方客户端。目前下单功能已经实现，下单功能完全采用官网真实数据，可以控制官网发短信或者打电话到指定的手机号码，下单后可以在手机中查看并且付款。前言 vue2的发布后自己也研究了一段时间，奈何公司的技术栈是以react为主，没有机会好好利用vue2去做一个完整的项目。虽然写了几个demo，但和写一个完整的项目还是有很大差别的。于是自己想着用空余...

JeOam 2019-08-20 14:26 评论0 收藏0
vue+node+mongodb 搭建一个完整博客

摘要：开发一个完整博客流程前言前段时间刚把自己的个人网站写完，于是这段时间因为事情不是太多，便整理了一下，写了个简易版的博客系统服务端用的是框架进行开发技术栈目录结构讲解的配置文件放置代码文件项目参数配置的文件日志打印文件项目依赖模块 Vue + Node + Mongodb 开发一个完整博客流程前言前段时间刚把自己的个人网站写完，于是这段时间因为事情不是太多，便整理了一下，写了个简易...

Miracle_lihb 2019-06-26 17:32 评论0 收藏0
sSpring Boot多模块+ Shiro + Vue：前后端分离登陆整合，权限认证（一）

摘要：前言本文主要使用来实现前后端分离的认证登陆和权限管理，适合和我一样刚开始接触前后端完全分离项目的同学，但是你必须自己搭建过前端项目和后端项目，本文主要是介绍他们之间的互通，如果不知道这么搭建前端项目的同学可以先找别的看一下。前言本文主要使用spring boot + shiro + vue来实现前后端分离的认证登陆和权限管理，适合和我一样刚开始接触前后端完全分离项目的同学，但是你必...

macg0406 2019-08-19 11:38 评论0 收藏0