年度账单h5 移动端兼容问题以及优化建议(vue)
定时器
vue实例中定义timer多余,创建的定时器代码和销毁定时器的代码没有放在一起,通常很容易忘记去清理这个定时器,不容易维护;建议使用this.$once(‘hook:beforeDestory’,()=>{});
_CountDownLoop() {
let timer = null;
timer = setInterval(() => {
// to do
}, 1000);
this.$once('hook:beforeDestroy', () => {
clearInterval(timer);
timer = null;
});
},微信背景音乐不播放
引入 <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js" type="text/javascript"></script>
document.addEventListener('WeixinJSBridgeReady', () => { this.$refs.audio.play(); }, false);
ios 11 12音乐播放两次
<audio ref="loading" loop src="../../assets/audio/loading.mp3" atoplay preload />
标签中使用atoplay 导致
解决<audio ref="loading" loop src="../../assets/audio/loading.mp3" preload />
mounted() {
this.$refs.audio.play();
}swiper兼容
不兼容ios10以下版本,导致白屏问题;可降低到swiper4* ,如3.4.2,可以兼容到iOS8也可以选择不使用;
swiper6 autoplay不生效,回退到5.x版本以下就可以正常使用了html2cancas
html2canvas 1.0.0-rc. 7在H5微信内置浏览器ios13.6、13.4系统下不能转换图片;换成1.0.0-rc.4 "html2canvas": "1.0.0-rc.4",
ios移动端 boder-dotted 显示是方块
年度账单h5 移动端兼容问题以及优化建议(vue)的更多相关文章
- H5移动端知识点总结
H5移动端知识点总结 阅读目录 移动开发基本知识点 calc基本用法 box-sizing的理解及使用 理解display:box的布局 理解flex布局 Flex布局兼容知识点总结 回到顶部 移动开 ...
- 超详细讲解H5移动端适配
前言 移动互联网发展至今,各种移动设备应运而生,但它们的物理分辨率可以说是五花八门,一般情况UI会为我们提供375尺寸的设计稿,所以为了让H5页面能够在这些不同的设备上尽量表现的一致,前端工程师就不得 ...
- 【移动端兼容问题研究】javascript事件机制详解(涉及移动兼容)
前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...
- 10天学会phpWeChat——第七天:创建一个自适应PC网站+H5移动端的模块
本教程基于phpWeChat核心框架1.1.0+版本.下载地址:http://s.phpwechat.com/app_38026ed22fc1a91d92b5d2ef93540f20 通过前面六讲的系 ...
- 基于SwiperJs的H5/移动端下拉刷新上拉加载更多的效果
最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...
- 旅行app(游记、攻略、私人定制) | 顺便游旅行H5移动端实例
<顺便游旅行>是一款H5移动端旅行app,提供目的地(国内.国外.周边)搜索.旅游攻略查询.游记分享.私人定制4大模块,类似携程.同程.去哪儿.马蜂窝移动端,只不过顺便游app界面更为简洁 ...
- H5移动端项目案例、web手机微商城实战开发
自微信生态圈一步步强大后,关于移动端购物的趋势,逐渐成为大众关心的内容,目前市场上关于移动商城的制定就有大量版本,比如.微商城.移动商城.移动webAPP.微信商城各等各种定义层出不穷,这就对于移动端 ...
- 基于SwiperJs的H5/移动端下拉刷新上拉加载更多
最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...
- Vue(SPA) WebPack模块化打包、SEO优化(Vue SSR服务端同构直出)、全浏览器兼容完整解决方案
白驹过隙,时光荏苒 大概去年这个时候写了angular 结合webpack的一套前端方案,今年此时祭出vue2结合webpack的一套前端方案. 明年的这个时候我又是在做什么... 读在最前面: 1. ...
随机推荐
- 【小菜学网络】MAC地址详解
上一小节介绍了以太网帧的结构,以及帧中各个字段的作用.参与以太网通讯的实体,由以太网地址唯一标识.以太网地址也叫做 MAC 地址,我们对它仍知之甚少. 以太网地址在不同场景,称谓也不一样,常用叫法包括 ...
- char什么时候会用空格进行填充?
char什么时候会用空格进行填充?
- 【Python】部署上手App后端服务器 - Linux环境搭建安装Python、Tornado、SQLAlchemy
基于阿里云服务器端环境搭建 文章目录 基于阿里云服务器端环境搭建 配置开发环境 安装 Python 3.8.2 安装 Tornado 安装 MySQL 安装 mysqlclient 安装 SQLAlc ...
- springBoot实现redis分布式锁
参考:https://blog.csdn.net/weixin_44634197/article/details/108308395 .. 使用redis的set命令带NX(not exist)参数实 ...
- 【EXP/IMP】问题总结
为了使测试与生产数据保持一致,只需要导出数据的时候,可以将测试库的表truncate,保留其它如索引,trigger,constraints,grants等不用再重新导. exp时候rows=y,其它 ...
- 【Oracle】如果有一个Oracle中的用户,想知道他有什么权限,怎么查看?
假如那到了一个新用户,test,想查看这test的所有权限都有哪些,可以这么操作 登录到test用户上,执行下面的SQL 1.查看test用户被赋予了哪些角色. select * from user_ ...
- 【VNC】vnc远程连接的时候无法显示图像已解决
介绍一个 VNC连接工具:iis7服务器管理工具 IIs7服务器管理工具可以批量连接并管理VNC服务器 作为服务器集成管理器,它最优秀的功能就是批量管理windows与linux系统服务器.vps.能 ...
- DOI技术扫盲一
DOI: desktop office intergration 桌面办公软件集成简单的将,就是我们在Windows桌面中打开的办公软件(如:word,excel,pdf等等)可以在SAP系统进 ...
- 2021年【线上】第一性原理vasp技术实战培训班
材料模拟分子动力学课程 3月19号--22号 远程在线课 lammps分子动力学课程 3月12号--15号 远程在线课 第一性原理VASP实战课 3月25号-28号 远程在线课 量子化学Gaussia ...
- k8s-jenkins持续发布tomcat项目
k8s-jenkins持续发布tomcat项目 一.需求 这个实验前期后后搞了很久(公司经常插一些别的事过来,然后自己比较懒,再加上自己知识不够扎实).二进制部署完k8s集群就开始做jenkins持续 ...