当前位置: 首页 > news >正文

小程序兼容iphoneX(齐刘海)代码,mpvue的写法

好像写了这个代码就兼容iphoneX以上,这段代码只写了底部,顶部其实也一样

1.main.js
在该文件定义一个全局的globalData

Vue.prototype.globalData = getApp().globalData
wx.getSystemInfo({
  success: res => {
    // console.log('手机信息res'+res.model)
    let modelmes = res.model;
    if (modelmes.search("iPhone X") != -1) {
      app.globalData.isIphoneX = true;
    }
  }
});
复制代码

然后在需要适配的页面

2.index.vue

  <div class="tab-footer" :class="{'isIphoneX-class': isIphoneX}"></div>
复制代码

3.index.js

data() {
    return {
        isIphoneX: this.globalData.isIphoneX, //适配iphonex
    }
}
复制代码

4.index.css

.isIphoneX-class {
  padding-bottom: 64rpx;
}
复制代码

相关文章:

  • java.util.ConcurrentModificationException
  • 面试汇总——社招算法题篇
  • Express开发性能优化
  • One Class SVM, SVDD(Support Vector Domain Description)(转)
  • 直接在docker下体验强大的构建平台Quickbuild
  • 聊聊G1 GC的String Deduplication
  • 反向代理
  • 在Spring Boot程序中上传和下载文件
  • Javascript 如何生成Less和Js的Source map
  • MySQL索引底层实现原理
  • 基础篇-脚本题(2)
  • 通过 WebSocket 实现 WebGL 3D 拓扑图实时数据通讯同步(二)
  • 新建Salesforce的自定义对象和自定义字段
  • js-方法
  • LOJ#2082. 「JSOI2016」炸弹攻击 2(计算几何+双指针)
  • [ 一起学React系列 -- 8 ] React中的文件上传
  • 【Leetcode】104. 二叉树的最大深度
  • Android单元测试 - 几个重要问题
  • C++回声服务器_9-epoll边缘触发模式版本服务器
  • CSS 提示工具(Tooltip)
  • JAVA SE 6 GC调优笔记
  • java取消线程实例
  • Terraform入门 - 3. 变更基础设施
  • XML已死 ?
  • 闭包--闭包作用之保存(一)
  • 得到一个数组中任意X个元素的所有组合 即C(n,m)
  • 关于字符编码你应该知道的事情
  • 聚簇索引和非聚簇索引
  • 前端知识点整理(待续)
  • 实现菜单下拉伸展折叠效果demo
  • 使用agvtool更改app version/build
  • 想写好前端,先练好内功
  • 一起来学SpringBoot | 第十篇:使用Spring Cache集成Redis
  • 译米田引理
  • 源码之下无秘密 ── 做最好的 Netty 源码分析教程
  • ​2021半年盘点,不想你错过的重磅新书
  • ### Error querying database. Cause: com.mysql.jdbc.exceptions.jdbc4.CommunicationsException
  • #免费 苹果M系芯片Macbook电脑MacOS使用Bash脚本写入(读写)NTFS硬盘教程
  • (k8s中)docker netty OOM问题记录
  • (附源码)node.js知识分享网站 毕业设计 202038
  • (论文阅读32/100)Flowing convnets for human pose estimation in videos
  • (学习日记)2024.01.09
  • **python多态
  • .Net Core缓存组件(MemoryCache)源码解析
  • .net php 通信,flash与asp/php/asp.net通信的方法
  • .NET 线程 Thread 进程 Process、线程池 pool、Invoke、begininvoke、异步回调
  • .NET 中使用 TaskCompletionSource 作为线程同步互斥或异步操作的事件
  • .NET下的多线程编程—1-线程机制概述
  • :如何用SQL脚本保存存储过程返回的结果集
  • ;号自动换行
  • [ IOS ] iOS-控制器View的创建和生命周期
  • [JDK工具-2] javap 类文件解析工具-帮助理解class文件,了解Java编译器机制
  • [JS]JavaScript 注释 输入输出语句
  • [JS真好玩] 掘金创作者必备: 监控每天是谁取关了你?
  • [Kubernetes]9. K8s ingress讲解借助ingress配置http,https访问k8s集群应用