1. 定时器

      vue实例中定义timer多余,创建的定时器代码和销毁定时器的代码没有放在一起,通常很容易忘记去清理这个定时器,不容易维护;建议使用this.$once(‘hook:beforeDestory’,()=>{});

          _CountDownLoop() {
      let timer = null;
      timer = setInterval(() => {
      // to do
      }, 1000);
      this.$once('hook:beforeDestroy', () => {
      clearInterval(timer);
      timer = null;
      });
      },
    2. 微信背景音乐不播放

      引入 <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);
    3. 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();
      }
    4. swiper兼容

      不兼容ios10以下版本,导致白屏问题;可降低到swiper4* ,如3.4.2,可以兼容到iOS8也可以选择不使用;
      swiper6 autoplay不生效,回退到5.x版本以下就可以正常使用了

    5. html2cancas

      html2canvas 1.0.0-rc. 7在H5微信内置浏览器ios13.6、13.4系统下不能转换图片;换成1.0.0-rc.4 "html2canvas": "1.0.0-rc.4",

    6. ios移动端 boder-dotted 显示是方块

年度账单h5 移动端兼容问题以及优化建议(vue)的更多相关文章

  1. H5移动端知识点总结

    H5移动端知识点总结 阅读目录 移动开发基本知识点 calc基本用法 box-sizing的理解及使用 理解display:box的布局 理解flex布局 Flex布局兼容知识点总结 回到顶部 移动开 ...

  2. 超详细讲解H5移动端适配

    前言 移动互联网发展至今,各种移动设备应运而生,但它们的物理分辨率可以说是五花八门,一般情况UI会为我们提供375尺寸的设计稿,所以为了让H5页面能够在这些不同的设备上尽量表现的一致,前端工程师就不得 ...

  3. 【移动端兼容问题研究】javascript事件机制详解(涉及移动兼容)

    前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...

  4. 10天学会phpWeChat——第七天:创建一个自适应PC网站+H5移动端的模块

    本教程基于phpWeChat核心框架1.1.0+版本.下载地址:http://s.phpwechat.com/app_38026ed22fc1a91d92b5d2ef93540f20 通过前面六讲的系 ...

  5. 基于SwiperJs的H5/移动端下拉刷新上拉加载更多的效果

    最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...

  6. 旅行app(游记、攻略、私人定制) | 顺便游旅行H5移动端实例

    <顺便游旅行>是一款H5移动端旅行app,提供目的地(国内.国外.周边)搜索.旅游攻略查询.游记分享.私人定制4大模块,类似携程.同程.去哪儿.马蜂窝移动端,只不过顺便游app界面更为简洁 ...

  7. H5移动端项目案例、web手机微商城实战开发

    自微信生态圈一步步强大后,关于移动端购物的趋势,逐渐成为大众关心的内容,目前市场上关于移动商城的制定就有大量版本,比如.微商城.移动商城.移动webAPP.微信商城各等各种定义层出不穷,这就对于移动端 ...

  8. 基于SwiperJs的H5/移动端下拉刷新上拉加载更多

    最早时,公司的H5项目中曾用过点击一个"加载更多"的DOM元素来实现分页的功能,后来又用过网上有人写的一个上拉加载更多的插件,那个插件是页面将要滚动到底部时就自动请求数据并插入到页 ...

  9. Vue(SPA) WebPack模块化打包、SEO优化(Vue SSR服务端同构直出)、全浏览器兼容完整解决方案

    白驹过隙,时光荏苒 大概去年这个时候写了angular 结合webpack的一套前端方案,今年此时祭出vue2结合webpack的一套前端方案. 明年的这个时候我又是在做什么... 读在最前面: 1. ...

随机推荐

  1. 4.5万字手把手教你实现MySQL TB级数据存储!!

    写在前面 业界对系统的高可用有着基本的要求,简单的说,这些要求可以总结为如下所示. 系统架构中不存在单点问题. 可以最大限度的保障服务的可用性. 一般情况下系统的高可用可以用几个9来评估.所谓的几个9 ...

  2. vue的路由以后的页面整合

    前面呢也提到一点点,今天就吧这个页面整合给分享一下.有不对的地方还望包容. 在vue中,一般在主显示的界面的路径呢一般是'/'也就是单括号中有一斜杠的这个呢是默认的显示路径.只要路由配置了这个路径用& ...

  3. win10/windows 安装Pytorch

    https://pytorch.org/get-started/locally/ 去官网,选择你需要的版本. 把 pip install torch==1.5.0+cu101 torchvision= ...

  4. 误删数据库怎么办?mysql 回滚,撤销操作,恢复数据

    刚刚不小心把数据库删掉了,于是想着上网上找找有没有可以恢复数据库的方法,没想到还真有,除了备份以外,还有以下方法. 在mysql有时执行了错误的update或者delete时导致大量数据错误恢复的办法 ...

  5. windows下如何安装Python、pandas

    windows下如何安装Python.pandas 本篇主要涵盖以下三部分内容: Python.Pycharm的安装 使用Pycharm创建.运行Python程序 安装pandas 1.Python. ...

  6. C#从入门到放弃治疗一:初探C#世界

    C#是一款高级的面向对象语言,运行于.NET framework之上的高级程序设计语言.其语言规范和,语法和java有着惊人的类似之处.所以如果你在学习C#之前有着java的基础,你将快速地入门.当然 ...

  7. hook笔记①

    汇编中push 0x*** retn表示跳转到某个地址继续执行 取消hook时会在多线程环境中可能被检测 去掉函数框架可以规避寄存器cpu前后状态监测 #pragma comment(linker,& ...

  8. 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 ...

  9. 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   ...

  10. 小步前进之WCF简介

    WCF 前言 什么是WCF? 契约 合约 前言 在 .NET Framework2.0 以及前版本中,微软发展了 Web Service..NET Remoting 等通信支持. 如果要进行通信,对于 ...