Cheris_LT的博客

由于在预览图片时，onshow、onhide都会接连触发，我一开始在onhide设置了figh为false，导致没有达到预期效果。后来想了想，是否可以用时间差来判断，如果onshow、onhide触发时间间隔太小，则判断为图片预览。结果在预览列表中的图片的过程中，发现关闭预览图片时触发了onshow，导致了页面数据刷新了。在预览图片时，previewImage前（或者使用的第三方组件，就在组件的外层盒子增加方法）设置变量为true，此时关闭预览，在onshow中判断变量，如果为true，则不更新数据。

在这个例子中，其实JavaScript并不需要做什么特别的事情，因为CSS的@media print已经足够控制打印时的样式了。由于CSS的@media print规则已经将内容隐藏了，所以打印出来的页面将是空白的。简单防白嫖，要让打印出来的页面是空白，通常的做法是在打印时隐藏页面上的所有内容。在JavaScript中，你通常不会直接控制打印的内容（因为那是CSS和HTML的工作），但你可以通过修改DOM元素的样式来影响打印效果。

【代码】vue 动态路由生成。

如果不想要马上上传的话，只需要增加:auto-upload=‘false’，然后在需要上传时，调用实例的submit方法即可执行httpRequest方法。如果需要做表单校验，则httpRequest只是为了获取到文件，首先不要设置auto-upload，选择文件后马上就调用httpRequest方法，在httpRequest方法中获取到文件并储存，方便后面做表单校验。但是如果是在表单中上传文件，且是直接和其他表单项数据一起上传的话，则需要手动进行上传。

这次试试新的写法，由于props是单向数据流，所以这里选择使用computed，在父组件改变值的时候，对应的dialog就会相应的改变状态。剩下的就是在dialog关闭的时候，需要通知父组件状态的变化。之前有尝试过使用watch去监听props的值，是可以做到想到的效果，但是代码稍微有一些冗余。在做后台管理系统的时候，dialog组件是我们使用频率比较高的组件，但是有一些需求现有的组件是不满足的。组件本身的属性我们保留，只需要根据需求添加，然后在使用的时候props去拿取使用就可以了。

1、lib-flexible插件，引入 lib-flexible插件，使 用lib-flexible 会根据设备的尺寸动态计算出HTML标签的 font-size 值,从而使得 rem 的计算能够自适应的进行调整。2、postcss-px2rem、px2rem-loader插件，作用为把px转变为rem。首先在main.js中引用：（可以使用npm下载，也可以直接下载文件，我这边是下载的文件）为了方便我们的快速应用，直接使用插件。别忘了在vue.config.js文件中的chainWebpack中配置。

为了保证页面流畅性，菜单表格使用了懒加载，但是在对菜单进行添加、编辑和删除等操作的时候，发现数据没有更新。这时候，需要手动去进行触发。思路很简单，在每一次懒加载获取子节点时，将对应的tree、node数据进行保存。在对数据进行操作之后，则手动调用获取子字节的方法来达到刷新数据的效果。注：修改和删除时，需要用父级id来刷新数据，因此存储当前数据行的父级id为pid；当添加的时候，需要用当前数据行id来刷新数据，因此存储当前数据行的id为pid；当点击添加、修改、删除按钮时，需要更新一下pid，保证目标节点。

那么这时候就需要去获取输入框的光标内容，由于在点击其他按钮时，输入框会自动触发失焦事件。今天接到需求，输入框在正常输入的同时，可以通过点击其他按钮在输入框光标位置添加内容。blurIndex 就是在输入框中的光标位置！然后在方法中传递一个参数，即可获取到数据源。因此在blur的时候去触发方法即可。

很多时候播放视频时会需要展示封面图，但是不可能每次都上传封面图。虽然pc大多数都可以自动使用第一帧为封面图，但部分机型还是不支持，因此需要自己手动去绘画一张。

注意父级等不要有overflow，否则会针对父元素去做吸附，那就没用了。position:sticky是去找最近的可滚动元素！

话不多说，直接调用就知道了。

当打印数据出来之后，发现typeof(err)是一个object，但是又无法使用err.msg取到。在使用elementUI上传组件时，想要获取上传失败后，后端返回的数据。后来发现需要获取的数据是以json格式存在于它的message中。想要直接输出返回的提示语。但是无法直接使用err.msg获取。接下来，就是为所欲为！

js 中 null == 0 为false，为什么 null >=0 为true。

因为ios设备既没有鼠标也没有键盘，所以在为移动Safari浏览器开发交互性网页的时候，PC端的鼠标和键盘事件是不够用的。在iPhone 3Gs发布的时候，其自带的移动Safari浏览器就提供了一些与触摸(touch)操作相关的新事件。随后，Android上的浏览器也实现了相同的事件。触摸事件(touch)会在用户手指放在屏幕上面的时候、在屏幕上滑动的时候或者是从屏幕上移开的时候出发。在h5中，经常会有用户左滑或者右滑手势展示对应效果的需求。看起来似乎很复杂，在vue中举一个例子，直接看懂！

在做项目的过程中，通常会有遇到这样的需求：某某事情发生，需要将页面调至黑白，作缅怀或者哀悼。那岂不是要一个个调整？

做背景模糊有很多方式，常用的为css中的filter属性，在属性值中使用blur()函数可以起到毛玻璃效果。但是经过实际操作之后会发现，它会包括所有的子元素（字体、图片）等都模糊化处理。为此想到一个思路为：增加同样的元素，叠加在元素下方，起到模糊的效果同时不影响子元素。亲测有效，漫漫前端路，又向前一步！

或者项目已经搞到一半了，害怕其他页面被影响的话，就在写的页面也可以使用。在app.vue中添加样式。

【代码】横向懒加载。

【代码】vue：css使用data中的变量。

是不是有遇到过，我咔咔误操作点击提交按钮两下，直接就请求两次，然后生成两次记录的尴尬场景呢？