- 博客(15)
- 收藏
- 关注
RSS订阅原创 element-UI 组件 dialog 中 ref 获取不到 dom 的问题解决方案
场景：vue + elementUI的项目。 dialog弹窗内包含表单，表单需要必填校验。 关闭弹窗或者再次打开弹窗前需要重置表单和重置校验（不显示上次的红色提示）遇到的问题：当直接使用 this.$refs[ref].resetFields()会报错官方解释：Dialog 的内容是懒渲染的，即在第一次被打开之前，传入的默认 slot 不会被渲染到 DOM 上。因此，如果需要执行 DOM 操作，或通过ref获取相应组件，请在open事件回调中进行。解决方...
2021-08-04 12:48:35
3721
1
原创 js中的（严格相等===）和（宽松相等==）速查表
js中的（严格相等===）和（宽松相等==）速查表。建议尽量用严格相等===。图片来自github-@dorey
2021-04-29 16:43:39
148
原创 css的块元素水平垂直居中3种方法---(父子元素的宽高未知、任意宽高情况)
总结一下css的块元素水平垂直居中。父子元素的宽高未知、任意宽高情况/** css代码 */.center{ width: 400px; height: 300px; background: darkslateblue; /* position: relative; 方法1*/ /* position: relative; 方法2*/ /* display: flex; align-items: center; jus.
2021-04-25 17:58:12
162
原创 左侧定宽，右侧自适应（左中右的双飞翼布局）--常用四种实现方式
左侧定宽，右侧自适应常用的四种写法如下，打开对应注释即可。左中右圣杯bushu，右侧自适应常用的四种写法如下，打开对应注释即可。 左中右的双飞翼布局大同小异，可复用。// css样式.box{ width: 100%; height: 100px; background-color: rgb(15, 56, 42); /* display: flex; 方法1 */ /* position: relative; 方法2 */}.box .left{ widt..
2021-04-25 17:27:08
121
原创 call、apply、bind的区别（简洁）
call、apply、bind的区别，欢迎指正。console.log('---------------------call/apply/bind区别---------------------')// call/apply/bind区别let Fcall = function(name) { this.name = name this.say = function() { console.log(this.name) } this.say().
2021-04-24 20:53:28
72
原创 for..in、for...of、forEach()、map()各种循环的区别
首先普通for循环就不说了。for..in （数组、对象、set、map） 用于遍历对象obj的键名key，或数组arr的index 会遍历原型链上的属性，忽略 可枚举性enumerable为false的属性。// 有四个操作会忽略enumerable为false的属性。// 1、for...in循环： 只遍历对象自身的和继承的可枚举的属性。// 2、Object.keys()： 返回对象自身的所有可枚举的属性的键名。// 3、JSON.stringify()：只串...
2021-04-24 17:25:53
306
原创 react-devtools调试工具下载及安装（最新2021年）
废话不多说。1、首先下载react-devtools扩展，下载==>github官方地址，如下图2、下载后的zip解压到自己的目标文件夹，然后打开Chrome浏览器（以Chrome为例）的扩展程序，==>加载已解压的扩展程序，如下图3、重新打开自己react的项目的地址，注意有坑：（1、必须react项目，2、安装扩展后必须关闭react项目的浏览器窗口或者关闭浏览器重新打开），然后就可以了，打开F12，如下图4、至此，结束！...
2021-04-17 17:02:06
6982
2
原创 “DevTools failed to load SourceMap” 浏览器警告解决方案
项目开发中遇到这个warning，虽然不影响效果，但是总觉得不舒服。解决方法：在webpack.config.js配置文件中加上这句配置即可：devtool:"source-map"，想深究的朋友请查看webpack官网devtool配置...
2021-04-16 16:16:49
2011
原创 高德地图，设置缩放级别zoom为小数，细化设置缩放颗粒度
项目中，用到了高德地图，用setFitView()方法设置自适配合适视野后，发现实际展示效果有点小。如下图：实际是产品经理提出来的，哈哈。so，必须要解决了......于是想到了setZoom()方法，只要在渲染最后位置先获取当前缩放比getZoom()，然后map.setZoom(map.getZoom() + 1)不就行了嘛！然并卵，缩放比zoom+1后超出了容器，放大比例太大了。那么能不能加个小数呢？比如map.setZoom(map.getZoom() + 0.3)？
2021-03-30 10:45:12
10433
2
原创 关于iview组件库中的时间插件Date-picker的校验不过和提交格式不正确的解决方法
最近工作项目中使用到了iview组件库，再使用其时间组件Date-picker的时候出现问题。1.时间选择上了以后，还是校验报错，验证通过不了，表单无法提交。2.就算不加校验，默认提交的时间格式是这样子的，显然不是后台要求的格式‘yyyy-MM-dd HH:mm:ss‘即使你代码中加上了format="yyyy-MM-dd HH:mm:ss"，提交的时候也是上图的格式，仍...
2019-10-24 17:42:26
1665
1
原创 vue项目中正确引用babel-polyfill后在IE中仍然无效，显示空白页的原因及解决方案
最近用vue开发项目，在git上直接拉取了一个vue-admin-template模板。然而该模板作者明确表明没有兼容IE，如果需要，自己安装babel-polyfill。由于本项目还是会考虑高版本IE的兼容，所以安装了babel-polyfill，并正确引用了，（安装和引用方法略，网上很多，至于引用方法1.在entry处引用。2.在main.js处import引用。经测试都是有效的，引用...
2019-05-13 11:21:09
11653
10
原创 关于vue中style标签添加scoped属性之后，ui插件的样式无法修改的问题解决方案
关于vue中style标签添加scoped属性之后，ui插件的样式无法修改的问题解决方案：如果使用的是stylus，样式穿透使用的是 >>> 如果使用的是less或scss，样式穿透使用的是 /deep/具体写法如下：//less、scss中的样式穿透.container /deep/ .el-input__inner { height: 48px;...
2019-03-26 19:04:12
767
原创 web前端安全之form表单提交前加校验_防止xss攻击
如果还不知道xss的话，网上有好多文章解释。xss的攻击种类很多。作为一名前端小白，本文只从前端常用实用的角度简单写了一下。这类场景就是form表单的提交。为防止xss攻击，表单的每个字段提交需要做校验或者编码。校验的话先不说，网上很多正则，比如校验手机号或者邮箱之类的。重点说的就是编码。提交前需要对提交的内容进行编码，防止特殊的标签之类的提交到后台。比如<script>alert('...
2018-07-02 17:29:27
8105
1
原创 jquery.md5.js的使用中参数的含义
1.使用jquery.md5.js的方法及参数： $.md5('字符串'，key，raw)； 参数key，即盐值，可以不写。 参数row，最好默认false，不写即false。一般不常用，不用设置。2.常用写法即： $.md5('字符串') 或 $.md5('字符串'，key值)；插件下载地址http...
2018-07-02 16:57:44
2056
原创 谷歌浏览器Chrome浏览某些网站会出现随机黑色大方块的bug解决方法
最近，更新了Chrome浏览器。浏览某些网页的时候会出现黑色方块，随机出现，一直闪动，看着十分不爽。于是乎查了相关论坛得到了解决方法。原因：由于Chrome浏览器自身bug。解决办法：Chrome 的设置---->高级---->使用硬件加速模式（如果可用）----->关闭此功能----->重新启动Chrome这样就ok了，拿走不谢！...
2018-05-29 11:42:38
7696
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人