资讯专栏INFORMATION COLUMN

个人小程序笔记 - 持续收录自己一年的小程序开发注意事项

ruicbAndroid / 3281人阅读

摘要:记录小程序常见问题组件标签问题表单页面经常遇到和表现出来的边距不同问题自带多端不统一注意和与的会有不自动弹起还有,之间的表现形式结合组件标签处理正常隐藏显示自动聚焦位置错乱穿透弹窗或遮罩层尽可能说服产品和在长表单页面中最好不要如下

记录小程序常见问题 组件(标签)问题 textarea

表单页面经常遇到ios和andriod表现出来的边距不同问题

Q: textarea自带padding - 多端不统一
wxml: 


js: 
wx.getSystemInfo({
    success: function (res) {
        that.globalData.system = !!~res.system.indexOf("Android") ? "android" : "ios";
    }
})

☆ 注意: wx:if和hidden 与 textarea的focus、auto-focus (会有不自动弹起) 还有 ios,android之间的表现形式 结合view组件(标签)处理
wx:if - ios正常隐藏显示自动聚焦
placeholder位置错乱, 穿透弹窗或遮罩层
☆ 尽可能说服产品和ui, 在长表单页面中, 最好不要如下图一样的设计
textarea(②)从超过一屏幕的下方出现, 且页面有提交悬浮块③的设计, 在滚动(①)时会出现textarea内容层级问题.

表单一般都是从上而下填写的, 悬浮设计为非必要. 因笔主说不过, 只能麻烦的隐藏显示, ios没事,但安卓切换显示表现不友好.

textarea 在 position:fixed的元素中时要给 textarea 增加属性 fixed: