微信小程序适配iphonex
// 在app.js中判断是否是哪种设备
globalData: {
isIphoneX: false,
userInfo: null
},
onShow:function(){
let that = this;
wx.getSystemInfo({
success: res=>{
// console.log('手机信息res'+res.model)
let modelmes = res.model;
if (modelmes.search('iPhone X') != -1) {
that.globalData.isIphoneX = true
} }
})
},
在需要引用的页面js文件中onload方法里获取全局变量
let isIphoneX = app.globalData.isIphoneX;
this.setData({
isIphoneX: isIphoneX
})
在 wxml文件中 进行css的逻辑判断
<view class="{{isIphoneX?'linkCon':''}} flex "> </wiew>
微信小程序适配iphonex的更多相关文章
- 微信小程序适配iphoneX的实现方法
一. 安全区域(safe area) 与iPhone6/6s/7/8相比,iPhone X 无论是在屏幕尺寸.分辨率.甚至是形状上都发生了较大的改变,下面以iPhone 8作为参照物,先看看iPhon ...
- 微信小程序适配iPhone X
1.获取设备型号 App({ // 全局数据 globalData: { // 其他数据定义 ... isIPX: false, // 当前设备是否为 iPhone X }, // 小程序启动入口 o ...
- 微信小程序开源
| UI组件 | | | | | | | | | weui-wxss ★1873 - 同微信原生视觉体验一致的基础样式库 | | | | | | zanui-weapp ★794 - 好用易扩展的小程 ...
- 如何解决微信小程序界面适配问题-引用-生命周期回调函数-优化机制-样式引入
如何解决微信小程序界面适配问题 .wxss page{ height: 100%; width:750rpx; } this.setData({ imageWidth: wx.getSystemInf ...
- 用 React 编写的基于Taro + Dva构建的适配不同端(微信小程序、H5、React-Native 等)的时装衣橱
前言 Taro 是一套遵循 React 语法规范的 多端开发 解决方案.现如今市面上端的形态多种多样,Web.React-Native.微信小程序等各种端大行其道,当业务要求同时在不同的端都要求有所表 ...
- 从0到1构建适配不同端(微信小程序、H5、React-Native 等)的taro + dva应用
从0到1构建适配不同端(微信小程序.H5.React-Native 等)的taro + dva应用 写在前面 Taro 是一套遵循 React 语法规范的 多端开发 解决方案.现如今市面上端的形态多种 ...
- 微信小程序中的iPhone X适配问题
微信小程序中的iPhone X适配问题 小程序中下方的导航会被iPhone X下面的那条黑线盖住[微笑脸],所以要专门为了iPhone X做样式上的适配[微笑脸] wx.getSystemInfo({ ...
- 精确计算微信小程序scrollview高度,全机型适配
众所周知,可以滑动的 scroll 组件在移动端非常的重要,几乎每个页面都要用到. 而小程序的 scroll-view 组件就比较坑了,非得指定一个高度才能正常使用.布局复杂的时候谁还给你算高度啊.. ...
- 微信小程序开发日记——高仿知乎日报(上)
本人对知乎日报是情有独钟,看我的博客和github就知道了,写了几个不同技术类型的知乎日报APP 要做微信小程序首先要对html,css,js有一定的基础,还有对微信小程序的API也要非常熟悉 我将该 ...
随机推荐
- ### Cause: org.apache.ibatis.binding.BindingException: Parameter 'name' not found. Available parameters are [arg1, arg0, param1, param2]
org.apache.ibatis.exceptions.PersistenceException: ### Error updating database. Cause: org.apache.ib ...
- angular2 学习笔记 ( 第3方插件 jQuery and ckeditor )
refer : https://forums.meteor.com/t/importing-ckeditor-using-npm/28919/2 (ckeditor) https://github ...
- SpringCloud的服务网关zuul
演示如何使用api网关屏蔽各服务来源 一.概念和定义 1.zuul最终还是使用Ribbon的,顺便测试一下Hystrix断路保护2.zuul也是一个EurekaClient,访问服务注册中心,获取元数 ...
- SQL字符串操作汇总
SQL字符串操作汇总 --将字符串中从某个字符开始截取一段字符,然后将另外一个字符串插入此处 select stuff('hello,world!',4,4,'****') --返回值hel*** ...
- FTP文件上传到HDFS上
在做测试数据时,往往会有ftp数据上传到hdfs的需求,一般需要手动操作,这样做太费事,于是有了下边代码实现的方式: ftp数据上传到hdfs函数: import java.io.InputStrea ...
- 批量导入数据到hive表中:假设我有60张主子表如何批量创建导入数据
背景:根据业务需要需要把60张主子表批量入库到hive表. 创建测试数据: def createBatchTestFile(): Unit = { to ) { val sWriter = new P ...
- SVN上传项目步骤
1.svn上传项目 首先选中父工程 ,右键选中Team的share project 2.share完再选中SVN 3.选中项目 一个一个share project 4.
- 闲聊 Exp/Imp 命令使用
1.Exp/Imp 命令可用的参数: 2.userid 参数必须跟在 Exp/Imp 命令的后面,可以省略,如 Exp Userid=用户名/密码@数据库实例名 或者 Exp 用户名/密码@数据库实例 ...
- 学习React系列(五)——使性能最优
提高性能可分为两方面: 一.配置层面 二.代码层面 本文只从代码层面考虑: 一.避免重复渲染 这里要说一句: 当shouldComponentUpdate返回false的时候不触发render函数也就 ...
- CSS基础:内联元素
简介 内联元素由于涉及到文本字体,读写方向,汉字和字母差异等诸多方面的影响,因此其盒模型比块级元素更加复杂,对于内联非替换元素,比如一行文本,主要由以下几种框构成: "em 框", ...