1. box-shadow在真机不显示问题,和ios问题
当设置好 box-shadow
时发现在开发者工具上显示阴影,但是到真机上不显示。且在ios上不显示问题。
box-shadow:0 2rpx 10rpx 2rpx rgba(73,101,210, 0.5); /*for Android*/
-webkit-box-shadow: 0 1px 5px 1px rgba(73,101,210, 0.5); /*for IOS*/
如上,颜色不应使用十六进制,使用 rgba
模式。且在 ios
上使用 -webkit-
兼容ios设备。
2. tab栏切换时,字体颜色等样式切换
需要切换样式的按钮(或输入框等)绑定不同事件,通过点击切换 data 中数据状态实现类名的动态绑定。
<view class='{{xxx?"yyy":""}}'></view>
其中 xxx
为 data
中数据用来实现 yyy
类名的存在与否(三元表达式)。点击事件用来切换 data
数据中的 xxx
的 true
或 false
值。
3.小程序中 map 地图组件和底部 tab 栏层级问题
在小程序中 map
组件的层级和底部 tab
栏的层级是最高且无法改变的,所以当这两个组件存在时想要在其上方做一个遮罩层,无论怎么设置遮罩层的层级都无法遮住这两个组件。
解决方法:当有遮罩层存在的时候将小程序中的 map 组件和 tab 栏组件隐藏。
map
组件可以通过设置标签的 hidden
属性进行隐藏
tabBar
则需要调用 wx.hideTabBar()
(在页面加载时)和 wx.showTabBar()
(去掉遮罩层时)
4.关于ios系统小程序 margin-bottom 无效的解决方法
使用 padding-bottom
替换 margin-bottom
5.小程序中textarea层级过高问题
可以使用 cover-view 解决,官方文档 注:应当使用 cover-view 内含有 button 组件,且最好给外层一个高度,否则可能会出现在真机不显示问题
上边问题3中 map 等组件的层级问题都可以使用 cover-view 解决,详见官方文档
6.小程序中textarea输入最大长度问题
如果不给 textarea
一个 maxlength
属性, textarea
组件会有一个默认最大长度,所以当输入很多文字时会发现即使没有设置最大长度也会输入不完整。
解决方法: maxlength="-1"
网友评论