自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(303)
  • 收藏
  • 关注

原创 小程序生成二维码

小程序小知识~

2022-06-02 17:21:27 488 1

原创 element保留小数点,并且只能输入数字的识别

<el-input v-model.number="userInfo.param" clearable :disabled="dialogType === 'look'" placeholder="请输入参数值" autocomplete="off" maxlength="10" type="number" oninput="if(isNaN(value)) { value = parseFloat(value) } ..

2022-03-09 09:28:03 239

原创 uni-app的接口引用处理

h5浏览器上要看到效果需要如下图所示设置:请求代码 onLoad() { const requestTask1 = uni.request({ url: '/enterpriseDeclaration/processVisualization', header: { 'content-type': 'application/json;charset=UTF-8', //自定义请求头信息 }, data:{ .

2022-02-21 15:43:58 487

原创 vue element-ui 三级路由 router.js的配置文件

问题回顾:我已经按照网上说的方法,配了很多的次内容,一直搞不清楚是什么问题?配了两个component:Layout,效果显示如下:而如果去掉一个呢?就会变成这样起码这个已经解决了导航条嵌套的问题,所以我们应该明白,问题出现在Layout的上面,layout这块是整个主页面的路由的,解决方法:新建vue槽,装子路由的内容最后的代码如下:...

2022-02-15 10:55:19 853 1

原创 vue element-ui el-upload文件自定义上传功能

HTML代码: <el-upload class="upload-demo" align="center" drag :limit="1" :auto-upload="false" action="" :on-change="handleChangeVideo" :file-list="fileList" > <i class="el-ic

2022-02-10 17:28:08 809

原创 js 获取元素距离顶部距离左侧的计算

document.getElementById('c').offsetTop //包含滚动条滚动高度的距离,从自身元素的margin开始计算document.getElementById('c').offsetLeft//包含左侧出现菜单栏的距离,从自身元素的margin开始计算

2021-11-25 09:41:30 1977

原创 横向滚动条导航的实现(纯css)

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&lt

2021-08-18 10:22:28 389

原创 移动端屏幕缩放字体自动更新大小的函数

<script> window.onload = function() { getRem(375, 100) }; window.onresize = function() { getRem(375, 100) }; function getRem(pwidth, prem) { var html = document.getElementsByTagName("html")[0]; var oWidth = document.body.cl.

2021-08-16 21:15:00 94

原创 【好看的按钮效果】

原文链接:https://www.jq22.com/code948<div class="buttons"> <h1>Simple hover effects with <code>box-shadow</code></h1> <button class="fill">Fill In</button> <button class="pulse">Pulse</button> <

2021-08-12 16:07:10 224

原创 小程序:解决input输入之后被吃掉一截显示、变短的问题

设置input为块级内容,并且设置高度input{display: inline-block; height: 50rpx;}如图所示:小写j和小写i都变成了一样的写法

2021-08-10 15:07:09 689

原创 在线ps工具

https://www.uupoop.com/#/editor?id=16451460387970126&mode=user

2021-07-06 13:36:20 343

原创 汉堡包导航条菜单hamburger.css插件

菜单按钮动画

2021-07-05 15:56:02 1077

原创 element的必填项只添加星号,不加入必填提示

只需要添加require并把prop的数据去除就好

2021-06-30 17:42:05 2386

原创 记录一个JS快速获取年月日时分秒的写法

https://www.cnblogs.com/youwei716/p/14088544.html

2021-06-18 18:40:16 241

原创 当需要数据(比如id)发生变化和不变化时都可以触发更新或者方法时,不需要用watch监听的方法

watch方法只能做到监听数据发生变化时,才能触发相应的数据变动并作出操作。但是,当我们在第一次触发并且把数据保存起来之后,再次操作则watch并没有监听数值没有发生变化然后再次作出相应的数据变动操作了。这时候,我们需要换个实现方式。祖父组件<Popup ref="popup" :dialog-type="type"></Popup>method:{ func(){ this.$refs.popup.toOpen(id) }}子组件:Popup

2021-06-16 10:45:40 800

原创 js将字符串作为函数名调用函数

var slideArr=new Array( 'slideLeft', 'slideTop', 'slideRight', 'slideBottom', 'slideLeftTop', 'slideTopRight', 'slideRightBottom', 'slideBottomLeft');function slideLeft(width,height,time){ console.log(width,height,time)}var width = 2

2021-06-10 15:17:02 902

原创 e-charts水平柱状图改变柱子颜色为渐变色

series: [ { type: "bar", name: "2020年", showBackground: true, backgroundStyle: { color: "#d7ffff3d", barBorderRadius: 10, ...

2021-06-05 17:17:15 187

原创 element-ui的时间插件问题

当进入编辑弹窗页面时,时间插件上是赋值了数据的,但是再次编辑的时候,发现无法反应。就算是增加@change函数获取变化也只是只有添加新数据的时候才会生效。然后我就做了这么一步,就把这个问题解决掉了。原来的写法,直接复制,然后v-modle="userInfo.date"渲染数据,但是无法再次编辑 this.userInfo.date = new Date(this.userInfo.year,this.userInfo.month - 1)新的方法:可以再次编辑 this.$set(th

2021-06-05 16:09:27 188

原创 匹配指定字符背后的所有内容(正则表达式)

示例dailySuperviseNum:'',//开展日常围网巡查数量dailySuperviseRes:'',//开展日常围网巡查结果epidemicPreventNum:'',//疫情防控检查数量epidemicPreventRes:'',//疫情防控检查结果mobileInspectionNum:'',//开展机动查验数量mobileInspectionRes:'',//开展机动查验结果onlineHouseNum:'',//监控科网上巡仓数量onlineHouseRes:'',/.

2021-06-05 14:18:21 5042 1

原创 e-chart 使用的一些属性标注

<template> <div class="chart" id="main" ref="chart"> </div></template><script>import { getRecordHistogram } from '@/api/user'import * as echarts from 'echarts';export default { // 堆叠柱状图 name: 'pileBar',

2021-06-03 17:31:45 287

原创 设计模式 —— 原型链模式(2021/5/27)

概念原型模式(prototype)是指用原型实例指向创建对象的种类,并且通过拷贝这些原型创建新的对象。对于原型模式,可以利用JavaScript特有的原型继承特性去创建对象的方式,真正的原型继承是作为最新版的ECMAScript5标准提出的,使用Object.create方法来创建这样的对象,如Object.create(prototype,optionalDescriptorObjects)拟物化解读袋鼠妈妈是小袋鼠的原型,小袋鼠可以和袋鼠妈妈不一样,也不会影响袋鼠妈妈模式作.

2021-05-28 00:08:44 121

原创 设计模式 —— 职责链模式(2021/5/26)

概念职责链模式提供一种方法顺序访问一个聚合对象中各个元素,而又不需要暴露该方法中的内部表示。eg链条上的每一个小节类似于jquery的each方法模式作用:1.为遍历不同的集合结构提供一个统一的接口,从而支持同样的算法在不同的集合结构上进行操作。2.对于集合内部结果常常变化各异,我们不想暴露其内部结构的话,但又想让客户代码透明底访问其中的元素,这种情况下我们可以使用迭代器模式。注意事项:1.一般的迭代,我们至少要有2个方法,hasNext()和Next(),这.

2021-05-26 23:22:05 92 1

原创 设计模式 —— 外观模式(2021/5/25)

概念外观模式(Facade)为子系统中的一组接口提供了一个一致的界面,此模块定义了一个高层接口,这个接口使得这一子系统更加容易使用。外观模式不仅简化类中的接口,而且对接口与调用者也进行了解耦。外观模式经常被认为开发者必备,它可以将一些复杂操作封装起来,并创建一个简单的接口用于调用。拟物化解读一个大户人家发馒头,通过门口发馒头,但是大户人家的馒头工序外界是不知道的,也不需要知道。模式作用1.在设计初期,应该要有意识地将不同的两个层分离,比如经典的三层结构。2.在开发阶段,子.

2021-05-25 23:28:37 103

原创 设计模式 —— 适配器模式(2021/5/25)

概念适配器模式(Adapter)是将一个类(对象)的接口(方法或属性)转换成客户希望的另外一个接口(方法或属性),适配器模式使得原本由于接口不兼容而不能一起工作的那些类(对象)可以一起工作。...

2021-05-25 22:36:40 52

原创 设计模式 —— 模板方法(2021/5/22)

概念模板方法(TemplateMethod)定义了一个操作中的算法的骨架,而将一些步骤延迟到子类中。模板方法使得子类可以不改变一个算法的结构即可重定义该算法的某些特定步骤。模板方法是一种代码复用的基本技术,在类库中尤为重要,因为他们提取了类库中的公共行为。模板方法导致一种反向的控制结构,这种结构就是传说中的“好莱坞法则”,即“别找找我们,我们找你”,这指的是父类调用一个类的操作,而不是相反。具体体现是面向对象编程编程语言里的抽象类(以及其中的抽象方法),以及继承该抽象类(和抽象方法)的子类。.

2021-05-22 23:38:51 105

原创 设计模式 —— 命令模式(2021/5/21)

概念命令模式(Command)的定义是:用来对方法调用进行参数化处理和传送,经过这样处理过的方法调用可以在任何需要的时候执行。也就是说该模式旨在将函数的调用、请求和操作封装成一个单一的对象,然后对这个对象进行一系列的处理。它也可以用来消除调用操作的对象和实现操作的对象之间的耦合。这为各种具体的类的更换带来了极大的灵活性。模式作用:1.将函数的封装、请求、调用结合为一体。2.调用具体的函数解耦命令对象与接收对象。3.提高程序模块化的灵活性。注意事项:1.不需要接口一致,直接.

2021-05-21 23:56:53 96

原创 设计模式 —— 建造者模式(2021/5/20)

概念建造者模式可以将一个复杂对象的构建与其表示相分离,使得同样的构建过程可以创建不同的表示。也就是说如果我们用了建造者模式,那么用户就需要指定需要建造的类型就可以得到它们,而具体建造的过程和细节就不需要知道了。建造者模式实际,就是一个指挥者,一个建造者,一个使用指挥者调用具体建造者工作得出结果的客户。建造者模式主要用于“分步骤构建一个复杂的对象”,在这其中“分步骤”是一个稳定的算法,而复杂对象的各个部分则经常变化。指挥者分配任务,建造者进行开发,各司其职,稳定在一个大的流程当中。...

2021-05-20 22:47:11 91

原创 设计模式 —— 观察者模式(2021/5/19)

概念观察者模式又叫发布订阅模式(Publish/Subscribe),它定义了一种一对多的关系,让多个观察者对象同时监听某一个主题对象,这个主题对象的状态发生变化时就会通知所有的观察者对象,使得它们能够自动更新自己。模式作用:1.支持简单的广播通信,自动通知所有已经订阅过的对象。2.页面载入后目标对象很容易与观察者存在一种动态关联,增加了灵活性。3.目标对象与观察者之间的抽象耦合关系能够单独扩展以及重用。注意事项:1.监听要在触发之前。// 引入jquery~(fu.

2021-05-20 00:08:55 76

原创 设计模式 —— 构造函数模式(2021/5/18)

概念构造函数用于创建特定类型的对象——不仅声明了使用的对象,构造函数还可以接受参数以便第一次创建对象的时候设置对象的成员值。你可以自定义自己的构造函数,然后在里面声明自定义类型对象的属性或方法。在JavaScript里,构造函数通常是认为用来实现实例的,JavaScript没有类的概念,但是有特殊的构造函数。通过new关键字来调用自定义的构造函数,在构造函数内部,this关键字引用的是新创建的对象。拟物化理解普通的门 -> 有花边和纹路的门模式作用:1.用于创建特定.

2021-05-18 23:18:40 170

原创 设计模式 —— 工厂模式(2021/5/17)

概念工厂模式定义一个用于创建对象的接口,这个接口由子类决定实例化哪一个类。该模式使一个类的实例化延迟到了子类。而子类可以重写接口方法以便创建的时候指定自己的对象类型(抽象工厂)。这个模式十分有用,尤其是创建对象的流程赋值的时候,比如依赖于很多设置文件等。并且,你会经常在程序里看到工厂方法,用于让子类类定义需要创建的对象类型。拟物化理解通过厂长,告诉我们内部的产品线需要做什么事情,我们不需要关心里面的流程,如果这个东西比如鞋子做的不好,我们可以自己去制定产品线,把原先的产品线覆盖掉.

2021-05-18 21:33:52 55

原创 设计模式 —— 迭代器模式(2021/5/17)

概念迭代器模式提供一种方法顺序访问一个聚合对象中各个元素,而又不需要暴露该方法中的内部表示。eg链条上的每一个小节类似于jquery的each方法模式作用:1.为遍历不同的集合结构提供一个统一的接口,从而支持同样的算法在不同的集合结构上进行操作。2.对于集合内部结果常常变化各异,我们不想暴露其内部结构的话,但又想让客户代码透明底访问其中的元素,这种情况下我们可以使用迭代器模式。注意事项:1.一般的迭代,我们至少要有2个方法,hasNext()和Next(),这.

2021-05-17 17:09:29 67

原创 设计模式 —— 单例模式(2021/5/16)

概念单例就是保证一个类只有一个实例,实现的方法一般是先判断实例存在与否,如果存在直接返回,如果不存在就创建了再返回,这就确保了一个类只有一个实例对象。在JavaScript里,单例作为一个命名空间提供者,从全局命名空间里提供一个唯一的访问点来访问该对象。eg:开发商的房子没有门,就创建一个门然后再进入房间,如果有,则直接进入房间,无需创建新的门...

2021-05-16 23:40:03 92

原创 设计模式 —— 代理模式(2021/5/15)

概念帮助别人做事代理模式(Proxy),为其他对象提供一种代理以控制对这个对象的访问。代理模式使得代理对象控制具体对象的引用。代理几乎可以是任何对象∶文件,资源,内存中的对象,或者是一些难以复制的东西。eg:房东想卖房,但是没时间看,所以就找了中介代理,帮忙做这个交流,然后房东负责收钱就OK了。隐藏了对房东的直接访问...

2021-05-16 00:18:15 72

原创 canvas 实现画板(五)画板内容下载为图片(2021/5/13)

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

2021-05-13 23:05:03 113

原创 canvas 实现画板(四)线条粗细,路径圆滑效果(2021/5/12)

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

2021-05-12 23:53:36 1544

原创 canvas 实现画板(2021/5/10)

将画笔功能:能够拖动鼠标在页面内绘图,能够设置画笔的粗细,设置画笔的颜色能够在任意位置绘制圆形:拖动鼠标即可随意在任意位置绘制圆形,并且可以随意定制大小能在任意位置绘制出矩形:拖动鼠标即可随意在任意位置绘制矩形,并且可以随意定制大小<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compat.

2021-05-12 00:20:26 118

原创 canvas 实现画板(三)(保留之前画的矩阵)(2021/5/11)

实现思路:把所有的画面内容保存起来,然后清除页面,再重新描绘<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-widt.

2021-05-12 00:19:23 289

原创 canvas 实现画板(二)(添加画矩阵功能)(2021/5/11)

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

2021-05-12 00:05:45 255

原创 canvas 刮刮乐(2021/5/9)

设置叠层的属性ctx.globalCompositeOperation = 'xor'<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi.

2021-05-09 23:59:54 426

原创 canvas 绘制时钟(二)(2021/5/8)

<canvas id="canvas" width="800" height="600" ></canvas> <script> var canvas = document.querySelector('#canvas') var cxt = canvas.getContext('2d') cxt.save() //保存最开始的状态 ...

2021-05-08 23:57:10 77

空空如也

空空如也

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

TA关注的人

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