前言抛物线动画应用场景较多，在购物车页面比较常见，那么，怎么来实现这样一个动画？先看一下Demo图。实现原理及步骤动态计算每一个加号到购物车的距离；// 加号到顶部的距离let iconTop = this.$refs.banner.$el.clientHeight + this.$refs['goods-' + id][0].offs...

效果图失帧比较严重，在手机上效果更佳。原理分析这个滚动页面由两个部分布局（底部固定的Tab页面除外）。一个是顶部的banner轮播，一个是下面的列表。这里的重点是做列表的动画，banner轮播的网上资料很多，请自行查找。这个动画最重要的是在滚动中实时计算startIndex和endIndex，动画比较简单，就是scale和opacity的变化。向下滚动...

因为一些特殊原因，导致系统重装，所以vscode的一些配置、插件也就随之丢失了。故，记录一下。插件Beautify 美化 javascript, JSON, CSS, Sass, 以及 HTML 。一般需要配合.jsbeautifyrc使用Eslint 检查代码是否符合规范GitLens Git提示language-stylus stylus语法支持Ma...

文章目录Vue2.6源码解读一：Global APIVue2.6源码解读二：mergeOptions  1、入口方法  2、检查组件名称的合法性  3、数据规范化、格式化  4、合并策略Vue2.6源码解读二：mergeOptionsmergeOptions是Vue的源码中常用的合并策略，对Vue的data、methods、computed、watch、lifecycle等等的合并。在Vue实例化

文章目录Vue2 源码解读一：Global APIVue2 源码解读二：mergeOptionsVue2 源码解读三：new Vue  1、入口方法  2、initMixin  3、stateMixin  4、eventsMixin  5、lifecycleMixin  6、renderMixinVue2 源码解读三：new Vue在创建Vue应用时，都会用到初始化Vue实例对象的方法new Vu

文章目录Vue2 源码解读一：Global APIVue2 源码解读二：mergeOptionsVue2 源码解读三：Vue实例Vue2 源码解读四：ObserverVue2 源码解读四：Observer深入理解Vue的响应式原理，需要先熟悉JavaScript的一些基础知识：原型和原型链Object.defineProperty：Vue做数据劫持最核心的方法，查看官方说明；Object.crea

项目场景一个已用Vue全家桶开发好的后台管理系统。应客户需求，需要限制电脑使用，但是不限制IP，用BS模式无法实现，故用Electron把该项目打包成CS模式的桌面应用。Electron部分，使用electron-builder打包程序，使用electron-updater自动更新程序。使用Vue CLI Plugin Electron Builder和Vue Cli3集成。Vue Cl...

在后台管理系统中，常常会因为不同的权限，展现不同的菜单。但这仅仅是显示控制，而我们要做的是没有的菜单权限，直接输入URL也不可访问，真正的实现菜单权限控制。一、动态菜单显示1. 后端返回的菜单数据处理后端返回的菜单数据一般有两种，处理好的树状结构、或者未处理的列表数据（这种情况需要我们去转换成树状结构，可看我的另外一篇博客【js树形结构操作】）。下面是后端返回的数据：[{"id": "1","pi