Vue
V1nc4nt丶
这个作者很懒,什么都没留下…
展开
-
vue+IOS9页面白屏
一、页面白屏一个已经上线的项目,客户反映:IOS9.2、IOS9.3的苹果手机打开白屏。分析原因当时猜想是不是IOS9的系统浏览器版本太低,不支持一些语法导致的。然后启动IOS9的模拟器,再连接浏览器,查看console的错误日志。果然,有一个错误就是不能识别const,再查看详细内容,是引用的Swiper中的一个swiper.bundle.js导致的。处理方案下载离线Swiper,然后在index.html中静态引用。如果有的组件没有离线版本,可复制源码,然后放在src/目录文件夹下的任原创 2020-07-16 11:54:44 · 2275 阅读 · 0 评论 -
Vue 实现动态生成路由(动态生成菜单,根据菜单动态生成路由)
在后台管理系统中,常常会因为不同的权限,展现不同的菜单。但这仅仅是显示控制,而我们要做的是没有的菜单权限,直接输入URL也不可访问,真正的实现菜单权限控制。一、动态菜单显示1. 后端返回的菜单数据处理后端返回的菜单数据一般有两种,处理好的树状结构、或者未处理的列表数据(这种情况需要我们去转换成树状结构,可看我的另外一篇博客【js树形结构操作】)。下面是后端返回的数据:[ { "id": "1", "pid": "0", "name": "工作台", "url.原创 2020-07-16 11:37:26 · 72896 阅读 · 34 评论 -
使用HTML图片热区area map制作区域地图的选择高亮效果
在制作区域地图时,往往我们会因为没有地图的坐标数据,无法使用Echarts来绘制地图,这时候我们可以使用HTML的usemap属性来完成地图效果。比如鼠标指到指定的地图区域,该区域高亮显示,然后显示该区域的一些基本信息,还有一些点击事件处理等等。示例图片:一、HTML的usemap属性img标签的usemap属性:它可以指定一个map标签map标签:地图集合。必须包含name属性area标签:区域坐标集合。shape指区域的形状,包括矩形rect、圆形circle、多边形polygon;co.原创 2020-06-17 16:19:17 · 8010 阅读 · 4 评论 -
webApp开发一些兼容性的坑
title: webApp开发一些兼容性的坑date: 2018-03-28 09:01:30tags:- 兼容性- 移动端web开发通过做嗨黔东南APP(IOS,Android)这个项目遇到过很多兼容性的坑,写博客记录备份一下,以免再次踩坑。移动端input处理禁用选择复制带来的问题大多数在禁用选择复制的问题都是通过user-select: none来处理。代码如下: ...原创 2019-07-14 09:48:04 · 2111 阅读 · 0 评论 -
Vue实现购物车抛物线动画
前言抛物线动画应用场景较多,在购物车页面比较常见,那么,怎么来实现这样一个动画?先看一下Demo图。 实现原理及步骤动态计算每一个加号到购物车的距离; // 加号到顶部的距离 let iconTop = this.$refs.banner.$el.clientHeight + this.$refs['goods-' + id][0].offs...原创 2019-07-14 09:50:47 · 2871 阅读 · 0 评论 -
Vue列表滚动的过渡动画
效果图失帧比较严重,在手机上效果更佳。 原理分析这个滚动页面由两个部分布局(底部固定的Tab页面除外)。一个是顶部的banner轮播,一个是下面的列表。这里的重点是做列表的动画,banner轮播的网上资料很多,请自行查找。 这个动画最重要的是在滚动中实时计算startIndex和endIndex,动画比较简单,就是scale和opacity的变化。向下滚动...原创 2019-07-14 09:53:01 · 5139 阅读 · 0 评论 -
使用electron-builder打包并自动更新
项目场景一个已用Vue全家桶开发好的后台管理系统。应客户需求,需要限制电脑使用,但是不限制IP,用BS模式无法实现,故用Electron把该项目打包成CS模式的桌面应用。Electron部分,使用electron-builder打包程序,使用electron-updater自动更新程序。使用Vue CLI Plugin Electron Builder和Vue Cli3集成。Vue Cl...原创 2019-07-14 10:16:33 · 7829 阅读 · 14 评论