随笔分类 - teach
摘要：起因是因为想了解闭包的内存泄露机制，然后想起《js高级程序设计》中有关于垃圾回收机制的解析，之前没有很懂，过一年回头再看就懂了，写篇博客与大家分享一下。 #内存的生命周期： 分配你所需要的内存： 由于字符串、对象等没有固定的大小，js程序在每次创建字符串、对象的时候，程序都会分配内存来存储那个实体。
阅读全文
摘要：（1）函数防抖debounce 函数触发停止一段时间后(期间不能再触发 debounce，否则将重新计时)，再执行回调函数 机制： 防抖函数主要利用定时器的延迟执行特性，根据是否有定时器在等待执行： 触发了一个事件后：如果有一个定时任务待执行，就清除定时器，重新计时。 如果没有任务待执行，就定时执行
阅读全文
摘要：前言 说到Vue的钩子函数，可能很多人只停留在一些很简单常用的钩子(created,mounted)，而且对于里面的区别，什么时候该用什么钩子，并没有仔细的去研究过，且Vue的生命周期在面试中也算是比较高频的考点，那么该如何回答这类问题，让人有眼前一亮的感觉呢... 前端进阶积累、公众号、GitHu
阅读全文
摘要：当做Vue-cli项目的时候感觉在路由跳转前做一些验证，比如登录验证，是网站中的普遍需求。 对此，vue-router 提供的 beforeEach可以方便地实现全局导航守卫（navigation-guards）。组件内部的导航守卫函数使用相同，只是函数名称不同（beforeRouteEnter 、
阅读全文
摘要：方式有两种 1、路由元信息（2.1.0版本之前） 2、属性方式（2.1.0版本之后新增） Vue2.1.0之前: 想实现类似的操作，你可以： 配置一下路由元信息 创建两个keep-alive标签 使用v-if通过路由元信息判断缓存哪些路由。 <keep-alive> <router-view v-i
阅读全文
摘要：（1）原理介绍 （2）静态布局 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>demo</title> <style type="text/css"> *{ margin: 0; padding: 0; } li{ list-
阅读全文
摘要：断点调试有两种打点方式 （1）控制台手动打点 （2）代码中添加 debugger打点 .
阅读全文
摘要：前端模块规范有三种：CommonJs,AMD和CMD。 CommonJs用在服务器端，AMD和CMD用在浏览器环境 AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。 CMD 是 SeaJS 在推广过程中对模块定义的规范化产出。 AMD:提前执行（异步加载：依赖先执行）+延迟执行
阅读全文
摘要：最近做一个移动端项目，弹框写的比较麻烦，查找资料，找到了这个组件，但是说明文档比较少，自己研究了下，把我碰到的错，和详细用法分享给大家！有疑问可以打开组件看一看，这个组件是仿layer-mobile的，很多用法都一样，可以看看哦！ 一、npm 安装 // 当前最新版本 1.2.0 npm insta
阅读全文
摘要：图上那些类似于星座图的点和线 是由vue-particles生成的，不仅自己动，而且能与用户鼠标事件产生互动。 是非常炫的一种动态特效 可以在Vue项目中使用，需要安装第三方依赖 使用步骤 1. 安装 npm install vue-particles --save-dev 复制代码 或者 npm
阅读全文
摘要：前言：之前没有接触过页面调用地图的项目，某次面试，老板要求我用vue-amap调用高德地图，回家以后，我去网上查了一些案例和教程，看似很简单的引入调用，我却整整弄了一宿，还没弄出来！！！百般无奈之下，我选择第二天重头来过，一定要找到什么原因... 结果！血的教训告诉我，记录教程的时候，一定要有实践基
阅读全文
摘要：懒加载优化 （1）前言 利用vue-lazyload实现图片懒加载，下面介绍下具体使用步骤 （2）下载安装第三方模块 （3）引入并激活相关参数 （4）组件调用 使用方法很简单，将图片的:src改为v-lazy即可，如下所示 此时效果如下 因为之前设置的img宽度为100，所以这里需要用到属性选择器去
阅读全文
摘要：解决方法如下 项目方案： 在最外侧添加样式操作 .
阅读全文
摘要：keep-alive 简介 keep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。 用法也很简单： <keep-alive> <component> <!-- 该组件将被缓存！ --> </component> </keep-alive> props incl
阅读全文
摘要：前言 据说阿里有一道面试题就是谈谈函数节流和函数防抖。 糟了，这可触碰到我的知识盲区了，好像听也没听过这2个东西，痛定思痛，赶紧学习学习。here we go！ 概念和例子 函数防抖(debounce) 在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时。 看一个🌰（栗子）： //模
阅读全文
摘要：CSS 属性 touch-action 用于指定某个给定的区域是否允许用户操作，以及如何响应用户操作(比如浏览器自带的划动，缩放等) 默认情况下，平移(滚动) 和 缩放手势由浏览器专门处理。该属性用于取消浏览器默认手势行为，开发人员自定义滚动和手势行为。 touch-action的值： auto :
阅读全文
摘要：一、CSS百分比padding都是相对宽度计算的 在默认的水平文档流方向下，CSS margin和padding属性的垂直方向的百分比值都是相对于宽度计算的，这个和top, bottom等属性的百分比值不一样。 这么设计的原因在我的新书（应该不出几个月就要出版了）中会有说明，这里不展开。 对于pad
阅读全文
摘要：阻止启动生产消息，常用作指令。通俗理解为消息提示的环境配置。 阻止启动生产消息 這又是什麽意思? 看下效果 （1）Vue.config.productionTip = false （2）Vue.config.productionTip = true 感覺多了一行信息 小结： 开发环境下，Vue 会提
阅读全文
摘要：在移动设备上进行网页的重构或开发，首先得搞明白的就是移动设备上的viewport了，只有明白了viewport的概念以及弄清楚了跟viewport有关的meta标签的使用，才能更好地让我们的网页适配或响应各种不同分辨率的移动设备。 一、viewport的概念 通俗的讲，移动设备上的viewport就
阅读全文
摘要：【前言】 eslint是一个JavaScript的校验插件，通常用来校验语法或代码的书写风格。这篇文章主要介绍了vue项目关闭eslint校验,需要的朋友可以参考下 【主体】 简介eslint eslint是一个JavaScript的校验插件，通常用来校验语法或代码的书写风格。 官方文档：https
阅读全文
浙公网安备 33010602011771号