微信小程序开发篇踩坑记录有哪些？

本文共计1439个文字，预计阅读时间需要6分钟。

最近参与了公司第一款小程序的开发，开发体验基本类似于基于WebView的混合式开发。可以调用官方强大的API，但也存在一些坑或不太习惯的地方。本文从实用性出发，记录了开发过程。

最近参与开发了公司的第一款小程序，开发体验基本类似于基于webview的混合式开发，可以调用官方强大的api，但也有一些坑或者说不习惯的地方。这篇文章从实用性出发，记录了开发过程中的一些问题：

1. 样式优先级混乱

在使用button组件时，发现在class中设置width不生效，下面贴上代码：

.my-button{ width: 140rpx; height: 60rpx; line-height: 60rpx; padding: 0; }

经过微信调试工具排查后，发现user agent的样式优先级居然大于我们自己写的样式类，这在浏览器中基本是不可能发生的事情

解决方案其实比较简单，给width添加!important的后缀或者style="width:140rpx"即可，修改后我们再看一下效果：

加上!important之后，其实宽度的实际效果已经符合我们的预期了，但是微信调试工具却仍然显示user agent样式优先，这应该算是调试工具的一个bug吧。