初次开发百度小程序 遇到的沟沟

应该和微信小程序差别不是很大了。

1.input组件不能正常居中文字,目前看到的带有输入框的都有此现象,如下图
clipboard.png
处理时,line-height比height设置高一些就可以了,当然这样只限于第二行动态码那块显示效果好些,因右侧有button按钮组件与之拼接,最终得以居中,第一行只有input的还是无法安全居中,期盼官方早点修复一下吧。

2.button组件默认样式有个小黑点 如图
clipboard.png

这个在css样式隐藏的比较好,试了好多次才找到,添加如下代码即可

swan-button:after{
    border:none;
}

3.input数字类型输入框正在输入时,点击其他按钮后,会首先触发input框失去焦点,而影响点击事件的触发,但是百度浏览器不同版本上出现,暂时没找出好的处理办法,这个在其他的百度小程序上也是如此,暂时也是期盼官方早点修复一下吧。

4.还是上边图里的input框,最外层元素只设置了高度的话,在低版本百度app里居然会失效,三行表单元素直接铺满屏……无奈之下只好把max-height和min-height同时也设置了一下,竟然没问题了。

5.视频横屏播放结束后,如果有需要跳转到其他页面的业务处理,这时安卓手机可能会出现下个页面的样式混乱,行高 字体大小严重错乱,返回当前页面时竖屏看到的视频会被横向拉伸。初步分析可能是因为横屏播放时将屏幕宽度直接带入了下一个跳转的页面进行单位的计算导致。
处理方法:跳转前强制退出横屏播放,this.videoContext.exitFullScreen()。这个方法是在看到苹果手机在执行跳转时会自动将横屏视频关闭后再跳转,苹果手机上就没出现这样的问题。

6.字体间距,如果说设计图上给的文本区域宽度最多刚好能装的下xx个字,计算过后一部分苹果手机上可能会出现少一个字的现象,文本之间默认间距不一样。需要设置一下 word-spacing和letter-spacing 。

7.事件委托后未获取到当前点击目标的属性,原因,父级绑定事件后,子元素第一层里绑定的属性,点击子元素内的元素时,不能通过e.target.dataset.xxx 获取到,需要对每个被点击后处理事件的最后一层的子元素进行属性的绑定,这样页面上的元素就会有很多都被绑定着属性,不知道有没有其他更好的办法。

猜你喜欢

转载自www.cnblogs.com/homehtml/p/12747140.html