随笔分类 - 前端实操小笔记
摘要：我们在使用elementIUI实现表单验证，内容比较多的时候，提示内容会被遮挡，这时候用户不清楚什么情况，还会连续点击提交按钮。这个时候需求来啦：我们需要在表单验证不通过的时候，页面滚动到对应校验不通过的位置。 大致思路 在表单验证方法validate中，提供了两个参数：是否校验成功，和未通过校验的
阅读全文
摘要：###预置条件： 1. 路由组件通过给key值附点击菜单时的时间戳reloadMain来实现组件的重载  2. 侧边
阅读全文
摘要：##Object.keys(obj).sort().forEach(...) , 注：仅用于对象的key值是可定义顺序的,如key值为时间错，数字等，通过sort(),可默认按照数组大小排序（也可通过sort的比较函数排序） object.keys/values() 和 for in 不能保证对象传
阅读全文
摘要：##前言 掘金文章 使用window.postMessage可以帮助我们进行安全的跨源通信。 基本原理是通过postMessage来发送跨文档信息，使用message来进行监听，当收到跨文档信息后，会触发message事件 ##postMessage语法 > argetWindow.postMess
阅读全文
摘要：##js中在变量名前加"~" 是位运算NOT，按位取反. var iNum1 = 25; //25 二进制原码等于 00000000000000000000000000011001 var iNum2 = ~iNum1; //转换为 11111111111111111111111111100110
阅读全文
摘要：vue2按需加载组件,或者异步组件,主要是应用了component的 is 属性 ###vue2中的动态组件component,官方文档 <!-- 组件会在 `currentTabComponent` 改变时改变 --> <component v-bind:is="currentTabCompone
阅读全文
摘要：element-UI的表单组件在使用时需要绑定prop属性才能使用自带的resetField重置表单，如果遇到表单项很多，而且大部分不需要校验，为了重置去一个一个设置prop的话很麻烦。 所以可以使用Object.assign来解决表单重置问题。 我们可以通过this.$data获取当前状态下的da
阅读全文
摘要：使用el-input的时候，光标聚焦在输入框，按下回车，会刷新页面。这是因为当el-form表单中只有一个input时，按下回车建会自动触发页面的提交功能， 产生刷新页面的行为 解决办法 法一： form表单内多增加一个元素，不占据位置即可 <el-form :model="form" ref="f
阅读全文
摘要：1.chrome切换标签时会出现，点击事件存在 2.进入无痕模式无法复现，貌似与浏览器页面缓存有关
阅读全文
摘要：1.在执行操作时带上一个随机数/时间戳，表示每一次的都是独一无二的
阅读全文
摘要：我们在开发过程中会碰到数据更新，但是视图并未改变的情况，情况如下： ###第一种:动态给对象新增属性或者删除属性是不会触发视图刷新的,Vue识别不到； ###第二种:通过数组下标修改数组中的元素或者手动修改数组的长度,Vue识别不到； ###解决方法1：静默刷新(使用v-if的特性) 在修改值之后将
阅读全文
摘要：document.addEventListener('visibilitychange', function() { if(document.hidden){ //当页面切换或隐藏时触发的代码,可以用来清除定时器 }else{ //当这个页面重新被唤醒的时候触发的代码,可以用来重新触发定时器 } }
阅读全文
摘要：
阅读全文
摘要：在Vue官方文档中指出，$forceUpdate具有强制刷新的作用。 那在vue框架中，如果data中有一个变量:age，修改他，页面会自动更新。 但如果data中的变量为数组或对象，我们直接去给某个对象或数组添加属性，页面是识别不到的 <template> <p>{{userInfo.name}}
阅读全文
摘要：  ![](https://im
阅读全文
摘要：##页面结构 <el-upload style="width: 93%" action="/stap/systemManage/weakPassword/excelImport" accept=".xls,.xlsx" name="assetFile" multiple ref="upload" :
阅读全文
摘要：white-space: nowrap; //文字强制不换行 display: block; //转换成行内元素 overflow: hidden; //超出异常 text-overflow: ellipsis; //超出显示省略号
阅读全文
