uniapp初识笔记3
21、iphone x 底部固定按钮适配
主要就是安全区的兼容。 1、mainfest.json 文件 app-plus 节点下配下 safearea "safearea": { "bottom": { "offset": "none" } } 2、添加安全区元素 .safe-reg { padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom); } 如: <view class="footer-region footer-region-fixed"> <view class="click-reg"> <text>我已阅读并同意该协议</text> </view> <view class="safe-reg"></view> </view>
https://ask.dcloud.net.cn/article/35564
22、1px 适配问题
ui说 默认的1px 过宽;
.border-b:after { position: absolute; content: ''; width: 100%; left: 0; bottom: 0; height: 1px; background-color: #e3e5e9; -webkit-transform: scale(1, 0.5); transform: scale(1, 0.5); -webkit-transform-origin: center bottom; transform-origin: center bottom; }
23、picker组件 修改样式
微信小程序暂不支持修改。只能使用 picker-view
https://ext.dcloud.net.cn/plugin?id=273
24、swiper组件滑动圆角;
ios上是直角,需要的是圆角。
解决;
外层套一个view,设置样式
border-radius: 10rpx;
transform: translateY(0);
overflow:hidden; /* 让照片循环的时候不变成直角 */
25、web-view
web-view 是一个 web 浏览器组件,可以用来承载网页的容器,会自动铺满整个页面。
https://www.cnblogs.com/Glant/p/11217270.html
26、ios bug
场景:
两个tab页面,这里叫首页与个人中心。用到了 store的state属性。通过 state的 hasLogin 来同时控制 俩页的 元素显示。当在首页 改变 hasLogin值时,首页 显示正常;个人中心页 也得到了通知,但出现 本地静态图片 未加载的bug。个人中心页,操作改变时,此bug在首页出现。
解决方式:
通过import 导入这些静态图片,然后 绑定到image标签。
27、image 常用样式
设定宽度,高度自动,不变形
mode="widthFix" style="width: 100%;"