![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
功能封装
功能封装
钥零零
一枚前端开发程序员
展开
-
H5项目dialog弹框封装
需求:H5项目在删除地址时需要弹出弹框提示是否确认退出登录,但该项目体积较小,没有引入组件库,所以决定自己封装一个dialog弹框。子组件<template> <div v-show="dialogVisible"> <div class="van-overlay" style="z-index: 2008;"></div> <div role="dialog" class="van-dialog" styl.原创 2021-09-24 16:31:37 · 827 阅读 · 0 评论 -
短信验证码功能编写
H5短信验证码功能,点击发送验证码调用后端接口,页面展示一分钟倒计时,倒计时结束重新显示发送验证码<li> <span class="ipt-name accounts"></span> <input type="tel" maxlength="11" placeholder="请输入手机号" v-model="phone" /> </li.原创 2021-08-25 11:02:04 · 264 阅读 · 0 评论 -
图形验证码功能编写
H5图形验证码功能,初始化显示图形验证码,点击图片切换验证码图片<li> <span class="ipt-name captcha"></span> <input type="text" maxlength="11" placeholder="请输入验证码" v-model="graphValidateCode" /> <img @click="chan.原创 2021-08-25 10:59:24 · 147 阅读 · 0 评论 -
jQuery获取url参数函数封装
路由跳转传参通过jquery进行参数获取,函数封装如下function getParam() { var url =window.location.href; let urlParams = url.split('?')[1]; let obj = {} if(urlParams){ let arr = urlParams.split('&'); for(let i = 0; i &.原创 2021-08-25 10:54:48 · 162 阅读 · 0 评论 -
基于微信实现H5扫一扫功能详细过程
在vue项目中,调用微信开发平台接口完成H5页面扫一扫功能原创 2022-05-23 14:42:24 · 3492 阅读 · 7 评论 -
vue项目拍照或上传图片并转化为base64格式(已实现)
需求:vue项目中,H5点击按钮触发上传图片或拍照上传,上传的图片使用base64位传输到后台,最终实现身份证拍照识别功能。实现过程(1)设置一个按钮和一个隐藏的input,点击按钮是触发按钮上传图片和拍照功能<div> <input id="filePhoto" type="file" ref="file" accept="image/*" hidden @change="onInputChange($event)" /> <div @click=.原创 2022-05-25 11:31:34 · 1571 阅读 · 0 评论 -
获取时间倒计时函数封装
需求:根据后台返回的失效时间进行倒计时计算,并实时进行倒计时内容变化效果://倒计时计算 endDate格式:'2022-03-16 22:19:02' queryObtainTimeForEnd: function(endDate) { var interKey = setInterval( () => { let date1 = new Date().getTime() //处理火狐IE浏览器不兼容问题原创 2022-03-28 09:51:49 · 85 阅读 · 0 评论 -
移动端文件、图片及拍照上传
需求:移动端点击图片触发上传图片或文件或拍照上传。文件上传 <a> <input type="file" ref="file" hidden @change="onInputChange('file')" /> <img src="@/assets/images/uploading-link.png" @click="triggerUpload('file')" /> </a>首先设原创 2020-09-28 13:18:28 · 1202 阅读 · 0 评论