自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(18)
  • 资源 (1)
  • 收藏
  • 关注

原创 实现全网页高亮关键词(一)

全网页高亮关键词,遍历得到文本节点。替换节点内容

2022-11-17 18:27:55 962 1

原创 关于实现call-apply-bind

实现call-apply-bind函数

2022-07-07 16:37:23 249

原创 截取带标签字符串个数再返回

背景:转发微博//@游向王者目标:网友翻出<font color='red'>杨</font><font color='red'>丽</font><font color='red'>萍</font>35岁时的视频,视频中的<font color='red'>杨</font><font color='red'>丽</font><font color='red'>萍</fon

2022-05-07 15:38:24 329 2

原创 项目性能优化(一)提高首屏速度

优化首屏,提升流畅性。

2022-04-11 18:04:42 688

原创 封装一个全局使用的二次确认弹窗

使用Vue.extend封装全局二次确认弹窗

2022-03-29 15:44:41 2085

原创 项目中添加权限校验

背景:在项目中,通常会给某些模块或者功能添加权限,只有有权限的人才能查看或者操作,本文记录下如何在项目中添加权限位的校验。实现:1、在页面刷新的时候,通过接口获取当前用户所拥有的权限。在接口正常返回之后,将返回的权限存储到Vuex(也可以自行选择存储方式)中。代码如下:this.$store.commit('SET_AUTHS', "要存储的数据");2、在项目中封装权限校验的方法$auth(目录可在src下面的plugin中)import Vue from 'vue';Vue.use({

2022-03-29 10:50:21 1485

原创 实现一个异步带Loading的控件组件

带异步状态的组件实现

2022-03-10 16:04:05 773

原创 关于输入框限制字数输入问题

在输入框输入内容,当需要限制字数的时候,如果是Input或者textarea,可以直接用maxlength进行字数的限制。如果是用div(添加了contenteditable属性),如果直接用input事件进行字数的限制,则会出现临界问题。问题起源:需求:限制输入框只能输入200字。初始解决方案:监听输入,判断当输入内容超过200字后,设置内容为前200。这样处理引发两个问题。问题1:输入到末尾超过200字之后,光标会跳到最前面,从而导致前面描述的取前200字失败,解决此问题可以手动操作光标。问题2

2021-07-29 18:41:40 4499 1

原创 关于自定义组件model的记录

在平时使用中,我们一般都是使用v-model进行双向绑定,v-model实际上是 默认会利用名为 value 的 prop 和名为 input 的事件,但是像单选框、复选框等类型的输入控件可能会将 value attribute 用于不同的目的。model 选项可以用来避免这样的冲突:触发的时候:比较适用于像单选等场景。......

2021-07-29 17:50:21 104

原创 关于修改el-pagination显示文字的问题

1、场景根据上图可以看到,element提供了附加功能,通过配置参数可实现总条数、跳转页面等的功能,但是有些不太友好的是,这些文字是写死的,不能自己通过插槽去修改,但是目前的需求就是和element提供的文字不一致,比如我只要xxx条,不要共字,那怎么符合当前需求呢?下面来说实现方法。2、修改查看element实现方式。1、进入element-ui下面的packages目录2、找到pagination目录,找到pagination.js文件根据代码可以看到,这里并没写死共XXX条,那这个文

2021-07-08 11:18:10 6939 7

原创 对象数组中根据某个字段排序

在处理数据的过程中,我们经常会遇到这样的需求:根据数组中每个对象的某个字段值将数组排序展示。如何实现呢?如下:1、字段的值是个可比较的,例如下面的age字段```javascript[ { name: '张三', age: 18, status: '青年' }, { name: '李四', age: 20, status: '青年' }, { nam

2021-06-29 17:07:09 4571 1

原创 修改Echarts自定义时间轴(datazoom)样式

修改Echarts自定义时间轴样式1、关于位置的调整2、设置时间轴自定义手柄处理方式1:传入svg path处理方式2:传入png3、设置时间轴阴影颜色以及选中阴影样式最近在应用中使用了带Echarts时间轴的折线图,记录了以下几个在使用过程中遇到的问题。怎么实现一个带时间轴的折线图可参考官方例子:https://echarts.apache.org/examples/zh/editor.html?c=area-simple1、关于位置的调整先看原效果图:想要让图靠左且上方贴近一点,怎么调整? -

2021-04-25 11:46:49 8585 1

原创 从零开发一个npm工具

我们经常会执行npm install XXX来安装插件或者工具,那么如何创建一个工具并通过npm包发布呢?1、初始化创建package.json在文件夹下执行命令npm init,根据提示信息输入。如下所示:完成后可以看见文件夹中多了package.json这个文件,如下所示:参数解析可参考此文章。......

2021-03-16 15:02:16 347

原创 使用nrm对npm源进行管理

nrm 介绍nrm是一个npm源的管理器。使用场景经常使用npm的人都知道,在项目中安装依赖等的时候,使用npm源经常会很慢,但是使用cnpm,在某些情况下又会有问题,因此很多人会选择将npm使用的源设置成taobao源,这样的话在进行npm发包的时候,就不行,又需要将npm重新设置成npm源,在此情况的基础上,我们可以使用nrm来对npm使用的源进行管理。使用1、安装:执行命令npm install -g nrm全局安装nrm。2、执行nrm --version查看版本以及检查是否安装成功。

2021-03-12 17:57:42 226

原创 关于Promise.all()

关于Promise.all()首先,我们要知道,Promise具有三种状态,如图所示:pending: 等待状态,比如正在进行网络请求,或者定时器没有到时间。fulfill:满足状态,当我们主动回调了resolve时,就处于该状态,并且会回调.then()。reject:拒绝状态,当我们主动回调了reject时,就处于该状态,并且会回调.catch()。因此就存在我们需要等几个异步请求都完成后再进行操作的情况。此时怎么做呢?设置定时?很显然无法保证。在次我们就可以使用Promise.all()

2021-03-10 14:17:17 389

原创 浅拷贝与深拷贝

谈到深拷贝与浅拷贝,首先我们需要先说一下数据类型。数据类型分为基本数据类型和引用数据类型。基本数据类型包括(String,Number,Boolean,Null,Undefined,Symbol),它们的特点是:直接存储在栈中。引用数据类型包括(Object,Array,Function),它们的特点是:在栈中存储的是该对象在栈中的引用,真实的数据存放在堆内存里。......

2020-09-24 18:04:12 326

原创 滑动条样式修改

滑动条样式修改主要修改3个属性:修改滑动条样式:效果如下:

2020-05-28 16:30:18 308

原创 textarea取消默认效果以及placeholder不显示问题

1、在用到textarea标签的时候,我们通常会发现,在点击输入文本框之后,文本框会有选中效果,如图所示:效果就是-丑!!那么怎么取消掉这个选中的效果呢?在textarea标签之中设置outline:none,便可达到效果,如下:html代码如下:css:2、在上面的html代码中我们可以看到,textarea文本输入框是设置了placeholder的,但是实际效果却是没有显示,这是什么原因?经过查找发现,在<textarea></textarea>标签之

2020-05-28 11:48:27 1302

ubuntu-16.04.5-desktop-amd64镜像

Ubuntu是一个以桌面应用为主的开源GNU/Linux操作系统,Ubuntu 是基于Debian GNU/Linux,支持x86、amd64(即x64)和ppc架构,由全球化的专业开发团队(Canonical Ltd)打造的

2018-11-14

空空如也

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

TA关注的人

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