- 博客(29)
- 收藏
- 关注
RSS订阅原创 vue-router报NavigationDuplicated: Avoided redundant navigation to current location 如何解决
测试添加图片NavigationDuplicated: Avoided redundant navigation to current location
2022-06-06 18:15:17
108
转载 input 粘贴事件和改变input光标颜色
paste事件就是粘贴事件 需要通过clipboardData获得粘贴的内容 pasteMe() { //获得粘贴的文字 let self = this; var data = null; var clipboardData = e.clipboardData; // IE if (!clipboardData) { //chrome clipboardData = e.originalEvent.clipboardData;
2021-10-26 18:25:09
319
转载 vue upload获取图片的宽高
beforeImgUpload(file) { let reader = new FileReader(); reader.onload = function (e) { let txt = e.target.result let img = document.createElement("img") img.src = txt i.
2021-10-13 10:23:25
1053
原创 sass-将scss转换为css
进入到所在的文件夹中运行以下命令：sass --watch inviteJoin.scss:inviteJoin.css
2021-10-12 10:28:12
199
转载 那些不常见，但却非常实用的 css 属性
1、-webkit-line-clamp 可以把 块容器 中的内容限制为指定的行数。并且在超过行数后，在最后一行显示"..."2、all: unset如果该元素的属性的值是可继承的，重置为父元素的继承的值，反之则改变为初始值3、clip-path / shape-outsideclip-path 属性使用裁剪方式创建元素的可显示区域。区域内的部分显示，区域外的隐藏4、object-fit / object-positionobject-fit 属性指定可替换元素的内容应...
2021-07-02 14:58:39
127
转载 图片裁剪clip-path / shape-outside
clip-path 属性使用裁剪方式创建元素的可显示区域。区域内的部分显示，区域外的隐藏。类似的裁剪还有 svg 的 clipPath。clip-path 的取值有以下几种图形inset(xxx): 裁剪为长方形circle(xx): 裁剪为原型ellipse(xxx): 裁剪为椭圆polygon(xx): 裁剪为多边形none: 不裁剪...
2021-07-02 11:53:59
178
原创 HTML中input输入框禁止复制粘贴剪切
禁止复制://禁止复制oncopy="return false"//禁止粘贴:onpaste="return false"//禁止剪切:oncut="return false"//禁止右键弹出:oncontextmenu="return false"//关闭自动完成功能（缓存）:autocomplete="off"
2021-07-02 11:42:34
665
转载 vue-cli4 下载本地文件失败 未找到文件
问题的原因在于引入static文件 需要配置下vue.config.js文件把static文件创建到public文件内如图配置
2021-05-28 10:06:10
507
原创 前端下载Excel
axios({ method: 'GET', url: '/api', params: params, responseType: 'blob', data:param}).then( res =>{ let link = document.createElement('a');// 创建...
2020-04-08 18:05:13
374
原创 beforeRouteLeave
有个需求：跳转到指定页面时再返回当前页面时保留之前搜索数据 否则清空搜索条件 用到了beforeRouteLeave 记录下来beforeRouteLeave(to, from, next) ： 离开路由之前执行的函数,可用于页面的反向传值，页面跳转。beforeRouteLeave (to, from, next) { this.$log.info(to, from,'route...
2020-04-08 17:26:46
24368
原创 正则验证 包含三个连续重复汉字
let reg = /(\([\u4e00-\u9fa5])*([\u4e00-\u9fa5])\2{2}([\u4e00-\u9fa5])*/g.test("你好好好ya")console.log(re) //true
2020-04-02 16:32:32
1589
转载 Vue中的diff算法
概念：diff算法是一种优化手段，将前后两个模块进行差异化对比，修补（更新）差异的过程叫做patch(打补丁)为什么vue,react这些框架中都会有diff算法呢，我们都知道真实dom的开销是很大的，这个跟性能优化中的重绘意义类似。某些时候我们修改了页面中的某个数据，如果直接渲染到真实DOM中会引起整棵树的重绘，那么我们能不能只让我们改变过的数据映射到真实 DOM,做一个最少的重绘呢，这就...
2020-03-31 17:05:08
301
转载 apply call bind中的null
如果把null作为this的绑定对象传入到call、apply或者bind，这些值在调用时会被忽略，实际应用的是默认绑定规则：function foo(){ console.log(this.a) }var a = 2;foo.call(null); // 2那么什么情况下会传入null呢？一种非常常见的做法是使用apply(..)来‘展开’一个数组，并当作一个参数传...
2020-03-31 16:53:46
437
原创 JS中every()和some()的用法
JS中every()和some()的用法every()与some()方法都是JS中数组的迭代方法。every()是对数组中每一项运行给定函数，如果该函数对每一项返回true,则返回true。some()是对数组中每一项运行给定函数，如果该函数对任一项返回true，则返回true。var arr = [ 1, 2, 3, 4, 5, 6 ]; console.log( arr...
2019-10-21 11:02:36
241
转载 常见样式问题七、word-break、word-wrap、white-space区别
这两个东西是什么，我相信至今还有很多人搞不清，只会死记硬背的写一个word-wrap:break-word;word-break:break-all;这样的东西来强制断句，又或者是因为这两个东西实在是太拗口了，长得又差不多，导致连背都很难背下来。那它们到底是什么呢？我在mozilla的官网上找到如下的解释：word-wrapword-break我们看到两个解释中都出现了 b...
2019-06-24 14:48:42
113
转载 自定义滚动条
.img-container::-webkit-scrollbar{ /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/ height: ~`px2rem(4)`; background-color: #F5F5F5; } .img-container::-webkit-scrollbar-track /*定义滚动条轨道 内阴影+圆角*/ ...
2019-06-17 16:57:54
102
转载 js数组常用操作方法小结(增加,删除,合并,分割等)
本文实例总结了js数组常用操作方法。分享给大家供大家参考，具体如下： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 2...
2019-05-14 10:37:08
189
原创 CSS文本超过两行用省略号代替
(1)只显示两行(或多行)，超出部分用省略号overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; // 控制多行的行数-webkit-box-orient: vertical;(2)只显示一行，超出部分用省略号white-space: nowrap;...
2019-05-14 10:35:57
4394
转载 CSS3自定义滚动条样式 -webkit-scrollbar
/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/ ::-webkit-scrollbar { width: 16px; height: 16px; background-color: #F5F5F5; } /*定义滚动条轨道 内阴影+圆角*/ ::-webkit-scrollbar-track { -w...
2019-05-13 21:16:30
114
原创 数组、对象的批量赋值
数组的批量赋值 let array = [5,6];let num1 = array[0]let num2 = array[1]console.log(num1,num2)//5,6//批量赋值let arr = [5, 6];let [num1, num2] = arr;console.log(num1, num2)//5，6对象的批量赋值const obj = ...
2018-10-22 15:51:02
5793
原创 对象的简写形式
const key = 'job';const obj = { num: 1, str: 'wonu', work: function () { }, key:'fe'}console.log(obj)const key = 'job';const obj = { num:1, str:'wonu', work:fun...
2018-10-22 15:00:10
1934
转载 使用JS在浏览器中判断当前网络连接状态的几种方法
使用JS在客户端判断当前网络状态http://miaoyunze.com/2017/05/04/network-status-check/?utm_source=tuicool&utm_medium=referral1. navigator.onLine 2. ajax请求 3. 获取网络资源 4. window.addEventListener() 1. naviga...
2018-09-26 15:45:20
7369
原创 event.stopPropagation()和event.preventDefault() 的区别
1.event.stopPropagation()这是阻止事件的冒泡方法，不让事件向documen上蔓延，但是默认事件依然会执行，当你调用这个方法的时候，如果点击一个连接，这个连接仍然会被打开2.event.preventDefault()这是阻止默认事件的方法，调用此方法时，连接不会被打开，但是会发生冒泡，冒泡会传递到上一层的父元素；3.return false ；这个方法...
2018-09-15 11:35:21
768
转载 颜色转换#ffffff如何转换成RGB
function hexToRgb(hex) { var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); return result ? { r: parseInt(result[1], 16), ...
2018-09-03 16:21:13
6313
转载 html5 连续的数字、英文不自动换行的解决办法
原文地址：http://www.html-5.cn/div-css/hacks/10122.html数字、英文不自动换行的解决办法 自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法解决办法，加入以下｛｝内的样式可以实现自动换行。.fn-enter{WORD-WRAP:break-word;TABLE-...
2018-08-27 19:18:24
1769
原创 react 移动端 监听滚动事件 获取滚动条距顶部距离
尝试了很多中方法，用下面代码实现了 componentDidMount(){ window.addEventListener('scroll', this.handleScroll); } handleScroll(){ console.log(window.scrollY) } ...
2018-08-27 12:12:02
11635
1
原创 css 背景色透明且渐变
background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1));看效果
2018-08-24 13:59:08
25003
7
原创 em 计算公式
一般情况下用：1➗父元素的font-size✖️转换像素值 = em值或者 需转换的像素值➗父元素的font-size = em值 注：1⃣️元素自身没有设置字号大小时，元素的width 、height、line-height、margin、padding、border等值转换都按下面转换 1➗父元素的font-size✖️需要转换的像素值 = em值2⃣️元素自...
2018-08-23 16:57:16
1794
原创 Ant Design 省市区联动数据
react的项目中用到了省市区的选择器组件，但没有对应的数据，找了一个相对较全的数据，记录下来，方便需要的同学查阅const city = [ { "id": "35", "label": "北京市", "value": "110000", "children": [
2018-08-23 16:24:10
8307
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人