年度账单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. ...
随机推荐
- 4.5万字手把手教你实现MySQL TB级数据存储!!
写在前面 业界对系统的高可用有着基本的要求,简单的说,这些要求可以总结为如下所示. 系统架构中不存在单点问题. 可以最大限度的保障服务的可用性. 一般情况下系统的高可用可以用几个9来评估.所谓的几个9 ...
- vue的路由以后的页面整合
前面呢也提到一点点,今天就吧这个页面整合给分享一下.有不对的地方还望包容. 在vue中,一般在主显示的界面的路径呢一般是'/'也就是单括号中有一斜杠的这个呢是默认的显示路径.只要路由配置了这个路径用& ...
- win10/windows 安装Pytorch
https://pytorch.org/get-started/locally/ 去官网,选择你需要的版本. 把 pip install torch==1.5.0+cu101 torchvision= ...
- 误删数据库怎么办?mysql 回滚,撤销操作,恢复数据
刚刚不小心把数据库删掉了,于是想着上网上找找有没有可以恢复数据库的方法,没想到还真有,除了备份以外,还有以下方法. 在mysql有时执行了错误的update或者delete时导致大量数据错误恢复的办法 ...
- windows下如何安装Python、pandas
windows下如何安装Python.pandas 本篇主要涵盖以下三部分内容: Python.Pycharm的安装 使用Pycharm创建.运行Python程序 安装pandas 1.Python. ...
- C#从入门到放弃治疗一:初探C#世界
C#是一款高级的面向对象语言,运行于.NET framework之上的高级程序设计语言.其语言规范和,语法和java有着惊人的类似之处.所以如果你在学习C#之前有着java的基础,你将快速地入门.当然 ...
- hook笔记①
汇编中push 0x*** retn表示跳转到某个地址继续执行 取消hook时会在多线程环境中可能被检测 去掉函数框架可以规避寄存器cpu前后状态监测 #pragma comment(linker,& ...
- https://stackoverflow.com/questions/3232943/update-value-of-a-nested-dictionary-of-varying-depth
https://stackoverflow.com/questions/3232943/update-value-of-a-nested-dictionary-of-varying-depth p.p ...
- file descriptor 0 1 2 一切皆文件 stdout stderr stdin /dev/null 沉默是金 pipes 禁止输出 屏蔽 stdout 和 stderr 输入输出重定向 重定向文件描述符
movie.mpeg.001 movie.mpeg.002 movie.mpeg.003 ... movie.mpeg.099 $cat movie.mpeg.0*>movie.mpeg ...
- 小步前进之WCF简介
WCF 前言 什么是WCF? 契约 合约 前言 在 .NET Framework2.0 以及前版本中,微软发展了 Web Service..NET Remoting 等通信支持. 如果要进行通信,对于 ...