目录

微信小程序cover-view中使用button不显示关于cover-view的冷知识

目录

【微信小程序】cover-view中使用button不显示(关于cover-view的冷知识)

废话不多说,先看小程序文档

https://i-blog.csdnimg.cn/blog_migrate/2431f3cafd2f4da0b6abc6415e9f21c4.png

文档上写的清清楚楚可以在cover-view中使用button

但是我在实际使用中却碰到在cover-view中使用button,button不显示的问题!

https://i-blog.csdnimg.cn/blog_migrate/b9ddcfe2c4a3514bfd49f2f38e1e37f2.png

项目中底部的button保存按钮是position-fixed固定在屏幕最下方的,列表中有input框,所以在真机滑动列表的时候,input框中的值会穿透button显示出来,令人懊恼!

后来将底部的view标签替换成cover-view后,发现button不显示了,经过一系列的实验和探讨,发现是 因为button设置了背景渐变色的原因。。。

解决办法:将button背景色的渐变色更改为单颜色。

cover-view的限制:

1、cover-view不支持背景渐变色,其内部的标签也不能使用渐变色。

解决办法:背景色换成单一颜色

2、cover-view不支持设置单一位置的border边框,比如想加个border-top上边框线来分割标签

解决办法:用cover-view将其高设置为1px,模拟出一个border边框线

3、cover-view不能覆盖textarea

解决办法:textarea在失去焦点的时候将其替换为view标签,点击的时候再换回textarea

我在cover-view中走了很多弯路,希望这篇文章能帮到你们,节省你们的时间!

如果帮到你了,能抽空给个赞或者评论的话,万分感谢!~