随笔分类 - 08.前端
HTML、JS、CSS 和一些框架方面的随笔
摘要：前言 Vue 中组件的使用很方便，而且直接取组件实例的属性方法等也很方便，其中通过 ref 是最普遍的。 平时使用中主要是对一个组件进行单独设置 ref ，但是有些场景下可能是通过给定数据渲染的，这时会结合 v-for 一块使用。那么在使用的时候具体怎么写？为什么这样写？下面就来探究下。 一、ref
阅读全文
摘要：CSS 实现图片对比CSS 实现图片对比（二） 上一篇文章中，实现了图片的对比功能。按照设想是可以实现任意图片的对比（主要是指图片大小）。 后面找了几张 NSAS 历史影像图对比，发现有问题，图片太多的话，图片超出父容器。 下面是对代码进行了调整。 1、通过图片的宽高，和容器的最大宽高比较，设置图片
阅读全文
摘要：CSS 实现图片对比CSS 实现图片对比（二） 前言 要做的功能中有历史图片对比，查找后发现并没有可用的组件等。 通过查资料，实现的方式大体有两种： 1、使用 resize 2、通过设置遮盖的 width 在通过考量后，这里选择第二种方式实现。 实现 HTML 结构 这里包了多层，是想适应不同的大小
阅读全文
摘要：昨天在做的一个功能时，同时弹出多个框展示多个表格数据。 这些弹出框可以自由拖动。单独的拖动好实现，给元素绑定 mousedowm 事件。 这里就想到了 Vue 里面自定义指令来实现。 一、自定义指令 在使用自定义指令之前，先对自定义指令有一定的了解。从以下几个方面着手： 1、自定义指令定义范围 全局
阅读全文
摘要：这两天在写后台管理的页面，需要使用到 Table ，而且会有下级。就想到了使用 Element table tree 结构。 使用过程中，一直不显示展开箭头，摸索调试了大半天，在这里特别记录下。 在 Table 基础上使用是比较简单的，直接加上几个对应的属性绑定就可以，代码如下： <el-table
阅读全文
摘要：一、提升 什么是提升？ 引擎会在解释 JavaScript 代码之前进行编译，编译中的一部分工作就是找到所有的声明，并用合适的作用域将这些变量关联起来，这也是词法作用域的核心。 js 引擎会把一些变量声明和函数声明提升到对应作用域的顶层（变量针对 var 声明的） console.log(a) //
阅读全文
摘要：Echarts 系列文章： Echarts 使用（一）：动态参数 Echarts 使用（二）：动态交互 在写这个文章前先看下 Echarts 的最新动态。 Echarts 发布了最新的 5.1.1 版本（21年4月23日），同时官方网站也同步更新了。 新的官方网站的配色看上去更好看了，示例也方便了不
阅读全文
摘要：基础系列文章： JavaScript 基础（一）：null 和 undefined JavaScript 基础（二）：String JavaScript 基础（三）：Number JavaScript 基础（四）：Array JavaScript 基础（五）：Object JavaScript 基础
阅读全文
摘要：前言 这个问题对于 Array 练习是一个很好的例子，并且也是面试中经常遇到的。 解题方法有多个，下面会逐个说下。 一、遍历 用遍历的方法实现应该是最先想到的方法。这个就需要对需要合并的数组合并再重新排序。 1、遍历两个数组 2、每一项：判断合并后的数组中是否有当前项（去重） /** * 对其中一个
阅读全文
摘要：在现在项目中执行脚本的情况比较少。但是如果有这样的要求，我们应该如何实现。 对于这个问题是鉴于有一个项目中实际遇到，就深入了解下。 一、eval eval 是全局对象的一个函数属性。 eval 接收的是一个字符串的脚本，如果不是字符串，会直接返回。 console.log(eval('2+2'))
阅读全文
摘要：基础系列文章： JavaScript 基础（一）：null 和 undefined JavaScript 基础（二）：String JavaScript 基础（三）：Number JavaScript 基础（四）：Array JavaScript 基础（五）：Object JavaScript 基础
阅读全文
摘要：基础系列文章： JavaScript 基础（一）：null 和 undefined JavaScript 基础（二）：String JavaScript 基础（三）：Number JavaScript 基础（四）：Array JavaScript 基础（五）：Object JavaScript 基础
阅读全文
摘要：基础系列文章： JavaScript 基础（一）：null 和 undefined JavaScript 基础（二）：String JavaScript 基础（三）：Number JavaScript 基础（四）：Array JavaScript 基础（五）：Object JavaScript 基础
阅读全文
摘要：基础系列文章： JavaScript 基础（一）：null 和 undefined JavaScript 基础（二）：String JavaScript 基础（三）：Number JavaScript 基础（四）：Array JavaScript 基础（五）：Object JavaScript 基础
阅读全文
摘要：一、前言 一直有在看 JS 基础的内容。一直也有在总结，现在是时候自己也写一些基础方面的系列。 后面会持续更新。 思来想去，就从基础数据类型开始。开始的开始就从 null 和 undefined（一生二，二生三，三生万物）。 基础系列文章： JavaScript 基础（一）：null 和 undef
阅读全文
摘要：canvas 系列： Canvas 绘制图片不显示问题 Canvas 基础（一） Canvas 基础（二）—— 滚动条问题 一、前言 最近在看到公众号文章，关于流星雨的，看着效果挺好。就跟着做了。 在做的过程中，对 Canvas 有了一些了解。同时在使用过程中会有一些问题。在这里总结记录下。 二、w
阅读全文
摘要：Echarts 系列文章： Echarts 使用（一）：动态参数 Echarts 使用（二）：动态交互 前言 做大屏、数据可视化的话，图表类的必不可少。 这其中使用 Echarts 的很多。 一、参数动态返回值 Echarts 中参数的配置功能很强大。对任何一项的配置都很细致。 虽然这样，但是有时候
阅读全文
摘要：一、前言 前一段时间在项目中需要用到播报文字语音。找到了 HTML 5 有这样的功能。 现在有时间进行总结下。 二、SpeechSynthesis SpeechSynthesis 接口是语音服务的控制接口。它可以用于获取设备上关于可用的合成声音的信息， 开始、暂停语音，或者别的命令。（MDN） Sp
阅读全文
摘要：一、前言 最近在做的一个项目，是由几个模块组成的。其中有几个模块需要在其他项目中也用到，所以单独开发，发布的时候放在本项目的根目录下。 系统做了权限认证，在登录后返回 Token 存放在 Cookie 中。问题是：和登录做一起的几个模块没有问题，但是其他独立的在请求资源的时候没有携带 Cookie。
阅读全文
摘要：前言 这几天在新的项目中由于要使用 video-player 组件，这个只能使用 npm 源才可以，使用淘宝镜像的话有问题就不能正常使用。 一、nrm 使用 安装： npm install -g nrm 可用镜像源 nrm ls 测试源速度 nrm test [reg] 使用源 nrm use [r
阅读全文
