uniapp 开发遇到的问题
1. App平台IOS端软键盘上方横条去除方案(禁用键盘上的^)
在 pages.json 中配置 style配置
"app-plus": {
"softinputNavBar": "none"
}
2.屏幕高度=状态栏高度+原生导航栏高度+可使用窗口高度+原生tabbar高度。
3.navigateTo, redirectTo 只能打开非 tabBar 页面,switchTab 只能打开 tabBar 页面。
4.页面结构复杂,css样式太多的情况,使用 image 可能导致样式生效较慢,出现 “闪一下” 的情况,此时设置 image{will-change: transform} ,可优化此问题。
5.在字体或高度中使用了 rpx ,那么需注意这样的写法意味着随着屏幕变宽,字体会变大、高度会变大。如果你需要固定高度,则应该使用 px 。
6.H5端页面刷新之后页面栈会消失,此时navigateBack不能返回,如果一定要返回可以使用history.back()导航到浏览器的其他历史记录。
7.tabbar 切换第一次加载时可能渲染不及时,可以在每个tabbar页面的onLoad生命周期里先弹出一个等待雪花。
8.tabbar 的页面展现过一次后就保留在内存中,再次切换 tabbar 页面,只会触发每个页面的onShow,不会再触发onLoad。
9.若需要禁止蒙版下的页面滚动,可使用 @touchmove.stop.prevent="moveHandle",moveHandle 可以用来处理 touchmove 的事件,也可以是一个空函数。
10.组件内引入图片要使用绝对路径。 /static/...
11.<picker>中最好写一个<view class="style">写样式,而不是在picker上加样式
12.<scroll-view>中写position: fixed,在ios下会有兼容性问题
13. 编译期判断环境可⽤条件编译,运⾏期判断可⽤uni.getSystemInfoSync().platform判断环境。
14. 若需要禁⽌蒙版下的页⾯滚动,可使⽤ @touchmove.stop.prevent="moveHandle",moveHandle 可以⽤来处理 touchmove 的事件,也
可以是⼀个空函数
15. 在普通的 H5+ 项⽬中,需要使⽤ document.addEventListener 监听原⽣扩展的事件。uni-app 中,没有 document。可以使
⽤ plus.globalEvent.addEventListener 来实现。
16. 在普通的 H5+ 项⽬中,需要使⽤ document.addEventListener 监听原⽣扩展的事件。uni-app 中,没有 document。可以使
⽤ plus.globalEvent.addEventListener 来实现
17. 如需调节checkbox,radio⼤⼩,可通过css的scale⽅法调节,如缩⼩到70%style="transform:scale(0.7)"
18. 页⾯结构复杂,css样式太多的情况,使⽤ image 可能导致样式⽣效较慢,出现 “闪⼀下” 的情况,此时设置 image{will-change:
transform} ,可优化
19.H5端页⾯刷新之后页⾯栈会消失,此时navigateBack不能返回,如果⼀定要返回可以使⽤history.back()导航到浏览器的其他历史记录.
20. 在小程序端 font-weight:bold ,要写bold,数值苹果不支持,还有就是文字颜色不能写rgba小程序苹果不支持会不显示
21. u-collapse折叠面板 小程序循环默认展开,动态渲染之后计算面板高度

uniapp 开发遇到的问题的更多相关文章
- uni-app开发踩坑记录
大部分问题是我在h5端看不到而在android.iOS平台上暴露出来的,不包含小程序 1.:class="['defaultStyle', dynamicStyle]" 不支持直接 ...
- 使用uni-app开发微信小程序
uni-app 开发微信小程序 前言 9月份,开始开发微信小程序,也曾调研过wepy/mpvue,考虑到后期跨端的需求,最终选择使用了uni-app,本文主要介绍如何使用uni-app搭建小程序项目, ...
- uni-app开发微信小程序引入UI组件库(Vant-weapp)步骤
uni-app开发微信小程序引入UI组件库(Vant-weapp)步骤 这里以vant-weapp为例 uni-app官方文档介绍引入组件的方法 1. 新建相关目录 根目录下创建 wxcomponen ...
- uniapp开发小程序
uniapp开发小程序 uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS.Android.Web(响应式).以及各种小程序(微信/支付宝/百度/头条 ...
- uni-app 开发随笔(踩坑记录)
这里总结一些uni-app开发时我遇到的坑 uni-app获取元素高度及屏幕高度(uni-app不可使用document) uni.getSystemInfo({ success: function( ...
- 使用uView UI+UniApp开发微信小程序
在前面随笔的介绍中,我们已经为各种框架,已经准备了Web API.Winform端.Bootstrap-Vue的公司动态网站前端.Vue&Element的管理前端等内容,基本都是基于Web A ...
- 使用uView UI+UniApp开发微信小程序--判断用户是否登录并跳转
在<使用uView UI+UniApp开发微信小程序>的随笔中,介绍了基于uView UI+UniApp开发微信小程序的一些基础知识和准备工作,其中也大概介绍了一下基本的登录过程,本篇随笔 ...
- 使用uView UI+UniApp开发微信小程序--微信授权绑定和一键登录系统
在前面随笔<使用uView UI+UniApp开发微信小程序>和<使用uView UI+UniApp开发微信小程序--判断用户是否登录并跳转>介绍了微信小程序的常规登录处理和验 ...
- uni-app开发小程序准备阶段
1.软件安装 开始之前,开发者需先下载安装如下工具: HBuilderX:官方IDE下载地址 下面开发工具根据需求进行安装: 微信小程序开发工具安装 https://developers.weixin ...
- uni-app开发一次,覆盖多端的前端框架
uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架,开发者编写一套代码,可编译到iOS.Android.H5.小程序等多个平台. 一套代码,运行多个平台 uni-app实现了一套代码, ...
随机推荐
- JVM是如何解决跨代引用问题的?
本文已收录至Github,推荐阅读 Java随想录 微信公众号:Java随想录 CSDN: 码农BookSea 不知道自己的无知,乃是双倍的无知.--柏拉图 目录 跨代引用问题 记忆集 卡表 写屏障 ...
- 《深入理解Java虚拟机》第三章读书笔记(二)——HotSpot垃圾回收算法实现(OopMap,安全点安全区域,卡表,写屏障,三色标记算法)
系列文章目录和关于我 前面<深入理解Java虚拟机>第三章读书笔记(一)--垃圾回收算法我们学习了垃圾回收算法理论知识,下面我们关注下HotSpot垃圾回收算法的实现,分为以下几部分 对象 ...
- 【随笔记】SiliconLabs Android Demo 编译
AndroidStudio:3.5.2 AndroidPhone:XiaoMi5 (Android 8.0) AndroidDemo:3.1.4-44 AndroidDemo 源码路径:Simplic ...
- 吾剑未尝不利,国内Azure平替,科大讯飞人工智能免费AI语音合成(TTS)服务Python3.10接入
微软Azure平台的语音合成(TTS)技术确实神乎其技,这一点在之前的一篇:含辞未吐,声若幽兰,史上最强免费人工智能AI语音合成TTS服务微软Azure(Python3.10接入),已经做过详细介绍, ...
- Linux之ssh远程连接
Linux之ssh远程连接 一.下载远程连接工具Xshell Xshell是一种远程连接工具,可用来远程连接虚拟机. Xshell免费版下载地址 输入名字和邮箱,可以在邮箱看到下载Xshell的链接. ...
- 如何在WSL下交叉编译openwrt
首先我们需要准备一个大小写敏感的文件夹. 然后拉取代码,并且执行代码的先决条件脚本. 注意,如果过程中某项条件不符,你可能要临时修复. 假如下图的组件判定失败(即出现ok=>fail) 那么你就 ...
- 分布式id的方案
1 简介 在分布式系统架构中,通常会涉及到分布式全局唯一ID的生成 在复杂分布式系统中,往往需要对大量的数据和消息进行唯一标识. 如在金融.电商.支付.等产品的系统中,数据日渐增长,对数据分库分表后需 ...
- Nginx08 通过扩容提升整体吞吐量 nginx平滑升级-添加sticky模块和使用
1 扩容方式介绍 一个单一站点,想要扩,可以从硬件软件等多个方面来进行. 1 单机垂直扩容:硬件资源增加 2 水平扩展:集群化 3 细粒度拆分:分布式 3-1 数据分区 3-2 上游服务SOA化(原生 ...
- 周末折腾了两天,踩了无数个坑,终于把win7装成了centos7
上周五的时候,突发奇想,想把自己的Thinkpad E430C的操作系统装成linux. 熟悉电脑的都知道Thinkpad E430C很古老了,现在算来从2012年买来,到现在已经经历了10个年头了. ...
- 2021级《JAVA语言程序设计》上机考试试题1
昨天进行了期末考试,考的不够理想,看见题没思路,到了10点半刚刚进入状态,11点半结束....... 这是学生的试题要求(按照评分卡上的来,卷子上要求和评分卡不一致(.......)) 这是登录页面 ...