自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 react事件机制分析

首先要知道,通过react注册的事件大部分并没有被注册到本身节点上,而是统一的注册到了document节点上,目标节点的事件被触时,该事件会冒泡到document上,注册到document的事件回调函数最终会执行到dispatchEvent函数,dispatchEvent函数主要进行事件分发,也就是执行需要执行的回调。第一个问题:事件处理函数是如何存储的,存储到了什么地方? 事件处理函数是如何存储的这个答案尚未得出,但是从第二个问题的答案可以看出,事件处理函数被存储到了c...

2020-09-28 10:31:08 531

原创 基于antd组件前端实现图片压缩

前端实现图片压缩的主要思路是:将图片利用canvas.drawImage进行绘制,绘制后调用toBlob方法转化为blob对象并压缩,最后通过new File()将blob对象转化为文件对象并上传;由于项目是使用antd组件进行开发的,图片上传使用的是Upload组件上传的,所以图片压缩放在了beforeUplaod方法中进行的。代码如下:<Upload accept='ima...

2019-11-04 15:10:49 2505 7

原创 js对象转换为查询参数拼接到url地址后面

function toQueryPair(key, value) { if (typeof value == 'undefined') { return `&${key}=`; } return `&${key}=${value}`;}function objToParam(param) { if (Object.prototype.toStrin...

2019-10-23 11:30:35 3181

原创 react、antd技术栈 新密码和确认密码相等校验

import { Form, Input } from 'antd';import React, { Component } from 'react';import { thisExpression } from '@babel/types';class ComponentA extends Component { constructor(props) { super(pro...

2019-10-21 10:34:32 4520

原创 antd 校验表单时触发对其他表单的校验

import { Form, Input } from 'antd';import React, { Component } from 'react';class ComponentA extends Component { constructor(props) { super(props); } /** * * @param {} rule *...

2019-03-22 21:49:30 16128 11

原创 数组的map方法返回值

先说一下数组map方法的使用:map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。map() 方法按照原始数组元素顺序依次处理元素。注意:map() 不会对空数组进行检测。注意:map() 不会改变原始数组。map方法返回一个新数组,当数组元素存在引用类型时,返回的新数组中的引用类型值和原数组中引用类型值是相等等,也就是说新数组和原数组中的引用类型...

2019-03-20 19:16:45 14120 2

原创 比较两个字符串日期大小的方法

let startDate = '2019-3-15 12:25:36';let endDate = '2019-4-23 12:36:45';let result = Date.parse(endDate.trim().replace(/-/g, '/')) &gt; Date.parse(startDate.trim().replace(/-/g, '/'));if(result)...

2019-03-16 16:57:12 3279

原创 使用百度地图添加标注时如何使用本地图标的方法

今天在项目中使用百度地图时,有一个需求就是在地图中添加标注,并且要使用本地的图标,于是代码这样写let myIcon = new BMap.Icon('./hongqi.png', new BMap.Size(15,25));let baiduPoint = new BMap.Point(point.longitude, point.latitude);let marker = new ...

2019-01-21 15:18:08 4142 4

原创 Vue中watch的一些用法

Vue中的watch对象是用来监听实例中数据的,当你有一些数据需要随着其它数据变动而变动时,就可以使用watch来监听。这里顺便提一下watch和computer的区别,watch中监听的数据,必须是在data中或者props中定义的,而computer则刚好相反,computer中定义的数据,则是在data或props中未定义的。常用的watch的写法:watch:{ user...

2018-12-05 09:30:47 307

原创 对象的深度克隆方法

方法1:function deepclone(obj) { if (typeof obj === 'object' && obj !== null) { if (obj instanceof Array) { let newArr = []; obj.forEach(item => { ...

2018-10-29 23:39:41 208

原创 vue-cli安装依赖后运行报错

These dependencies were not found:* !!vue-style-loader!css-loader?{"sourceMap":true}!../../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-de3f5272","scoped":false,"hasI.

2018-10-17 10:35:19 1433

原创 删除数组元素的两种方式splice和delete

Array.splice(start,count)const arr = ['a', 'b', 'c', 'd', 'e'];let result = arr.splice(1,2);console.log(result); // ['b', 'c'];console.log(arr); // ['a', 'd', 'e']console.log(arr.length); // 3...

2018-09-21 17:30:56 6366

转载 vue-cli中util.js详细解读

本文转载自http://www.cnblogs.com/ye-hcj/p/7078047.html,在此基础上做了部分修改代码:// 引入nodejs路径模块var path = require('path')// 引入config目录下的index.js配置文件var config = require('../config')// 引入extract-text-webpack-...

2018-09-21 09:36:24 3678

转载 flex布局的兼容性问题

flex兼容性问题

2017-09-06 12:10:51 1044

转载 angular中发布/订阅模式详解

Angular按照发布/订阅模式设计了其事件系统,使用时需要“发布”事件,并在适当的位置“订阅”或“退订”事件,就像邮箱里面大量的订阅邮件一样,当我们不需要时就可以将其退订了。具体到开发中,对应着</span>scope和<span></span>scope和<span>rootScope的$emit</code>、<code>$broadcast和$on</code>方法。本文介绍Angular的

2017-08-21 20:19:25 2590

转载 Object.keys()用法

我经常使用JavaScript对象。非常喜欢。相对来说,数组虽然也很好用,但javascript Object提供了另一层次的数据结构和数据信息,这是简单的数组是无法比拟的。例如,我们可以非常方便的从一个JavaScript对象里寻找一个键值,比在数组里更迅速。通常我们探索一个对象里的属性时,喜欢使用hasOwnProperty()方法,其实这个方法很不优雅;Object.keys(不是O

2017-07-19 18:20:43 2444

转载 css3伸缩布局盒模型

CSS3引入的布局模式Flexbox布局,主要思想是让容器有能力让其子项目能够改变其宽度,高度,以最佳方式填充可用空间。Flex容器使用Flex项目可以自动放大与收缩,用来填补可用的空闲空间。  更重要的是,Flexbox布局方向不可预知,不像常规的布局(块级从上到下,内联从左到右),而那些常规的适合页面布局,但对于支持大型或者复杂的应用程序就缺乏灵活性。

2017-07-07 12:31:29 578

原创 json字符串和json对象之间的相互转换

json字符串转换为json对象用JSON.parse()方法jsonObject=JSON.parse(jsonString);json对象转换为json字符串用JSON.stringify()方法jsonString=JSON.stringify(jsonObject)

2017-07-06 19:33:02 376

原创 多行文本溢出最后一行显示省略号

现在的浏览器都支持text-overflow:ellipsis属性,用来实现单行文本的溢出显示省略号,但是这个属性并不支持多行文本。那么有没有方法在多行文本上实现同样的效果呢?1、-webkit-line-clamp Webkit支持一个名为-webkit-line-clamp的属性,他其实是一个WebKit-Specific Unsupported Property,也就是说这个

2017-07-06 09:31:44 3543 1

原创 一个盒子在另一个盒子中垂直居中的方法

今天介绍几种让一个盒子在另一个盒子中居中的方法;内联元素:给子盒子设置display属性为inline,然后在设置line-height为父盒子的高度html: p标签 css:.box { width: 200px; height: 200px; margin: 100p

2017-05-09 18:41:55 4875

原创 关于删除数组中相同元素的一个小技巧

如果说到删除数组中的相同元素,比如这里定义一个数组var arr=[1,1,2,2,3,3,3],我想要删除数组中的2,那么应该怎么做呢。大家都会想到使用for循环就可以了,of course . var arr=[1,1,1,2,2,2,3,3,3,3];for (var i=0,len=arr.length;i<len;i++){ if(arr[i]===2){

2017-04-20 23:21:24 1163

空空如也

空空如也

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

TA关注的人

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