自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

您的博客

日进有功

  • 博客(38)
  • 收藏
  • 关注

原创 一文带你实现轻量级的打印功能(vue/js原生版本)

vue如何实现打印功能,vue开发打印功能,vue实现打印功能

2024-07-18 15:44:51 451

原创 uni-app微信小程序如何开发蓝牙功能

uni-app小程序中开发蓝牙功能,uni-app微信小程序对接蓝牙功能,微信小程序开发蓝牙功能,支付宝小程序开发蓝牙功能。

2023-11-14 19:47:16 2860 7

原创 vue造轮子完整指南--npm组件包开发步骤

前端npm造轮子指南,vue造轮子指南,npm包发布指南

2023-09-26 19:51:00 1628

原创 uni-app接口请求封装

uni-app的接口请求封装,uni-app通用api接口请求封装

2023-07-27 14:30:07 5304

原创 JavaScript定时器(setTimeout和setInterval)的用法技巧

js定时器的用法技巧,setTimeout的用法技巧,setInterval的用法技巧

2023-07-12 17:03:06 459

原创 扫码枪(扫描枪)扫码在vue中的使用教学

扫描枪在vue中的使用案例,扫码枪在vue中的使用案例,vue中如何使用扫描枪/扫码枪。vue使用扫描枪的教学

2023-06-18 14:53:53 5762

原创 JS过滤筛选树形JSON数据,filter递归实现路由菜单的筛选

js过滤筛选树形结构数据 filter方法递归获取路由菜单数据

2022-08-07 16:50:46 3023 1

原创 季度选择组件和上下半年度选择组件的功能实现

季度选择组件的实现;上下半年度选择组件的实现

2022-07-14 20:22:48 1555

原创 el-table实现自定义列表功能

el-table列表实现自定义列表功能,实现自定义排序,自定义列表展示,自定义列宽等

2022-06-01 19:16:02 5499 4

原创 instanceof的实现原理浅析及手写instanceof的实现

instanceof的实现原理和手写instanceof的实现。

2022-04-11 16:45:27 3575

原创 input输入框和select选择器“结合”使用

input输入框和select选择器结合使用实现既可输入内容模糊搜索也可选中具体选项进行精确搜索(基于element组件库实现)

2022-04-07 16:05:00 18314

原创 element的el-table表格和el-pagination分页相结合使用

element表格和分页使用技巧

2022-04-02 14:22:12 7409 2

原创 浅析vue中的混入(mixins)

vue中的混入(mixins)

2022-03-31 20:21:13 2947

原创 el-from表单在v-if、v-show和自增、自减表单项的时候,会出现表单校验异常或者串项的异常解决办法

el-from表单在v-if、v-show和自增、自减表单项的时候,会出现表单校验异常或者串项的异常解决办法

2022-03-27 14:41:54 1645

原创 echarts案例资源大总结和echarts的高效使用技巧(细节版)

全网echarts案例资源大总结和echarts的高效使用技巧

2022-03-25 10:10:43 3032

原创 v-model的双向数据绑定实现原理(附:案例和项目实例)

一. 前言。相信对使用vue框架的童靴来说,v-model的使用都能信手沾来,熟悉的不能再熟悉,也都知道v-model其实是个语法糖。不过其究竟是怎么实现的双向数据绑定,很大一部分童靴还是心存疑虑。本文就根据最简单的案例和基于实际项目中最常用的实例来从两个角度讲解v-model的前世今生。二. v-model的前世今生。目前的几大主流MVC(VM)框架都实现了单向数据绑定。简而言之,vue中的v-model无非就是在单向数据绑定的基础上给对应表单元素(input、select等)添加了(in

2022-03-11 17:25:08 16954

原创 密码校验密码正则校验,密码表单校验总结

js密码校验,密码正则校验,密码表单校验。

2022-03-08 16:21:47 6124 2

原创 万能的css样式居中法,你知道几个?

万能的css样式居中法总结

2022-03-02 14:32:16 1167

原创 js实现年月加减月份的计算(纯原生实现当前年月n月前和n月后的年月)

js实现年月加减月份的计算(纯原生实现当前年月n月前和n月后的年月)

2022-02-28 15:14:28 1978 2

原创 阿里icon小图标在vue中的教学使用(两种主流方案)

1.小图标的前世今生。曾几何时,H5开发还是以雪碧图作为小图标的一种处理方案;然而,随着时间迁移,在当今前端开发环境中,icon小图标的使用率越来越高,需求越来越精致。虽然Element、Iview、Vant等组件库也相应提供了一些自带的icon图标,可是在追优的PM眼中,高大上的icon小图标才是其所想要的。本着专业人做专业事的心境,挑选和使用最优,最好的小图标就成了前端开发们的一种准则。2.阿里巴巴 -- iconfont。在众多icon小图标的资源站中,阿里巴巴的iconfont无疑是其中

2022-02-16 09:43:06 9388 2

原创 开源项目 CDN 加速服务站合集:除了BootCDN,你还知道其他免费的前端开源项目 CDN 加速服务吗

开源项目 CDN 加速服务站合集

2022-02-11 15:56:05 2970

原创 ECharts案例大全(最新版),含各种案例,实例。

前言:2022年2月以前,ECharts官网除了提供官方案例外,还额外提供了一个ECharts案例资源丰富的强大社区MakeA Pie来展示各类的ECharts案例。这对于广大开发者,特别是前端页面仔们来说简直是个福音网站。然后,现在却因无人维护,该社区被停用了。 这一停用无疑给广大ECharts使用者们带来一阵阴影(ps:要是遇上复杂的ECharts图标需求,那不得每次都是重头画起。呜呜~~) 方法一:不过不要慌张,本着遇到问题就解决问题的干劲,社区动力大佬为大家重新整理了一份几乎和原MakeA...

2022-02-07 14:44:57 35841 34

原创 JS经典排序之冒泡排序和快排,入门级手写实现。

1.虽然前端在实际工作中较少用到算法体系,不过最基本的数组排序还是得知道下,特别是冒泡排序和快速排序,这两种排序也是在面试中高频出现,所以本文就以动画和手写的方式来展示这两种最基本的数组排序算法。2.话不多说,直接上正菜。冒泡排序let arr = [23, 56, 520, 920, 888, 666]; // 冒泡排序(写法一) function mp1(arr) { if (arr.length < 2) { return a

2022-01-14 17:24:21 3872

原创 JavaScript的深浅拷贝解析及手写深拷贝实现

1. 说到JavaScript的深浅拷贝,那么必然得从其‘源头’说起----JavaScript的两大数据类型(基本数据类型和引用数据类型)。基本数据类型的特点:数据直接存储在栈中。 引用数据类型的特点:存储在栈中的是对象的引用,而真实的数据存放在堆内存中。基本数据类型:String、Number、Boolean、Null、Undefined、Symbol、BigInt。 引用数据类型:Object。 2. 深浅拷贝的区别。浅拷贝:只复制指向某个对象的指针,而不复制对象本身,新旧对

2022-01-13 20:36:37 435

原创 el-date-picker组件实现特定日期禁用(例如:只能选取当前日期(含)和以后的日期)。

禁用当前日期之前的日期(只能选择今日到今日之后):<el-date-picker type="date" placeholder="请选择时间" :picker-options="pickerOptions" v-model="ruleForm.date" :clearable="false" ></el-date-pi

2021-12-30 10:52:54 2685

原创 element的table表格多选结合分页实现已选中的记忆功能和实现表格数据和已选数据动态同步更新

1.先上效果图:1-1.一开始无数据(相当于新增):1-2:一开始有数据(相当于编辑):2.主要实现逻辑:借助element组件的table表格的selection-change方法(ps:element组件的table表格)结合分页组件,自行定义一个用于存储当前页的已勾选数据,一个用于存储所勾选的所有数据(也就是右侧展示已勾选数据),及一个标志位来实现。3.具体代码实现:3-1:HTML结构:A:图示:B:......

2021-12-01 12:01:45 2719

原创 moment.js在vue中的使用及时间插件moment.js的常用时间格式总结

1.前言:本文仅针对时间插件moment.js在vue中结合elm组件的基本使用及最常见的几种时间格式总结,可视为‘cv’大法的精髓之作(极大提高开发效率,算了,直接说懒吧,即贴即用);不作深入,有需深入moment.js的同学可自行前往它的官网http://momentjs.cn/学习。2.使用篇:2-1:实际开发中一般都是结合element或者iview等组件库的日期组件使用。所以使用moment.js前请自行安装引入这些组件库(太过简单,这里不作累述)。2-2:第一步,需要使用mome

2021-09-13 16:37:41 6642 2

原创 iview表单的校验类型,类型不同导致校验异常的解决。

1.iview表单的校验类型默认是字符型,所以在一些情况下,对于input框或者是InputNumber框时,因其是数值。所以会导致无法校验的异常。例如以下案例.2.所以要处理这一异常(非常反人类);就得给对于的校验字段设置对应的类型。3.更多校验字段的类型说明,可前往iview官网和表单的rules字段说明查看明细。iview的form表单。form表单的rules字段类型详解...

2021-07-27 11:30:16 1079

原创 Js的节流和防抖讲解及手写实现(基于通俗易懂案例说明)

1.众所周知,JavaScript的节流和防抖是很多面试官都喜欢问的问题(更有甚者会让面试者简易手写出对应的主要实现过程和步骤).这里就此讲解下最简而易懂(大佬勿喷)的一种方法和其说明.2.节流和防抖的概念:A.节流概念: 事件(节流体内的函数)触发后每隔一段时间(节流体内的定时器时间) 触发一次,可以触发多次.B.防抖概念: 事件(防抖体内的函数)动作完成后的一段时间(节流体内的定时器时间)** 后触发一次**.3.未加节流和防抖的案例(代码和执行效果): function move(){

2021-06-08 10:42:12 245 2

原创 当select组件的选择项数据量过大时的处理方法

问题来源及发生场景: 正常使用elm组件库的secect选择器组件时;对应的下拉选项的options数组都是由后端返回的数据;此时如果该数据是成千上万条的时候;select组件会因为加载数据显得异常的卡

2021-05-26 21:07:04 4325 2

原创 vue前端分页,后端未做分页将所有数据统一返回,前端基于Vue和Elm组件库的分页实现(纯前端分页)

先上效果图.(后端接口请求一次,返回所有(1000条为例)数据,前端拿到所有数据处理分页).使用情形: A.正常情况下,前后端分离的项目,对于表格类数据多的情况,都是由前端传当前页的页码和当前页的容量大小给后台,后台拿到这些字段进行分页返回数据(即前端动一页就发送一次请求拿到当前页的数据,这部分应用太过简单,这里不再累述). B.特殊情形下,后台不处理分页,只会在请求的时候一下将所有数据一起返回,这时候就需要前端同学自己处理分页了(本文针对的就是这种情形下的一种处理方式,仅供参考,大佬勿喷)...

2021-05-19 10:56:05 1851 10

原创 swiper在vue中的基本使用及常见问题解决

1.说明:本文针对的环境是vue2及swiper6以下版本.另:本文只适合教小白如何在vue中使用swiper,并不会把swiper的api都码一遍,了解更多swiper详情,请移步swiper官网.这里只是最简单的入门教程.大佬勿喷.2.废话不多说,先上效果.3.开始:3.1: 安装依赖.npm install vue-awesome-swiper --save(注意:如果安装后,启动项目报Module not found: Error: Can’t resolve ‘swiper/dist

2021-04-21 10:21:27 1055

原创 JS获取当前年月份的每一天,获取当前月的每一天日期等

1.先上效果图:2.有时候我们的需求需要展示当前月份的每一天,比如以下的echarts需求:那此时就可以很好的得到了.代码部分:data() { return { dataArr: [] //当前年月的每一天数组 }; }, methods: { /*获取一个月的天数 */ getCountDays() { let curDate = new Date(); let curMonth = curDate

2021-04-02 16:30:48 1418

原创 ECharts在vue中的使用方式,动态获取数据并重新渲染.

ECharts在vue中的使用及ECharts案例大全

2021-04-02 15:24:23 24692 5

原创 vue中axios的封装使用(简易封装),统一API接口管理

1.在vue项目中,和后台交互获取数据这块,我们通常使用的是axios库,它是基于promise的http库,可运行在浏览器端和node.js中。他有很多优秀的特性,例如拦截请求和响应、取消请求、转换json、客户端防御XSRF等。更多详情,请移步axios官网.2.话不多说,先上完整代码链接.GitHub代码(如因网络等原因打不开GitHub,请移步码云代码).3.整体结构示意图:4.主要步骤:4.1: 安装axios依赖:npm install axios4.2:s...

2021-04-01 16:03:39 736

原创 vue的路由和多级菜单的联动及布局,结合element组件的el-menu的实现.(后台管理系统的基础路由,菜单及页面)

1.话不多说,先上github整体demo代码链接:git整体demo代码2.效果图:3.说明:此demo并未做路由权限控制,只是vue-router结合element组件库的Layout 布局和NavMenu 导航菜单实现基础后台系统的单级和多级菜单的联动.4.主要代码文件说明:5.主要文件代码展示(重点部分均有注释):1. 路由(router-index.js):import Vue from "vue";import VueRouter from "vue-ro..

2021-03-31 17:12:49 3006 1

原创 iview组件库表单中upload组件的校验及upload上传文件个数的限制;自定义上传(多用于未提供action上传地址的时候使用).

1.iview中的upload组件置在form表单中时,自定义校验规则实现.(注重点: 1.给upload组件加上对应的ref用于获取上传文件的fileList; 2.给upload组件双向绑定v-model值,和定义uploadList变量用于表单校验.)<FormItem label="sim文件:" prop="sim"> <Upload ref="upload" v-model="formValidate.si

2021-03-24 14:23:30 3552

原创 input框只取正整数,非负数等整理(以element组件库el-input组件在vue中常见的几种取值筛选为例)

1.限定取值为非负整数(可输入0和正整数)限定:<el-input style="width:300px" v-model.number="value" type="number" clearable placeholder="请输入非负整数" min='0' onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode || event.which))) || event.which === 8"></

2021-03-08 16:25:34 1941

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除