当前位置: 首页 > Web前端 > CSS

小程序开发中的那些小坑

时间:2023-03-30 13:38:49 CSS

最近专攻小程序开发。把我遇到的小坑分享给大家。欢迎指正。显示解决方案:这是wxparse代码中的一个bug。在一些特殊的手机中,wxparse/html2json.js中的第112行和119行使用了一个console.dir函数。注释掉这个函数。内容将正常显示。2.小??程序textarea组件问题小程序textarea组件字数限制问题解决方法:Content:textarea组件不能在滚动视图中使用。swiper和swiper-item继承了scroll-view,所以在其中使用textarea时,会出现奇怪的现象,比如placeholder错位。解决方法:将swiper组件换成view组件,使用微信小程序的wx.animation()实现点击切换效果。此外,地图、画布和视频组件不能在滚动视图中使用。否则,会出现很多奇怪的现象。3、input组件的问题:placeholder文本与input的值重叠。没有解决办法。当获得或失去焦点时,光标和文本跳转。它出现在一个奇怪的位置,没有解决办法。失去焦点时也会触发bindconfirm事件,类似于blur。没有解决办法。对输入进行动画处理时,如果处于焦点状态,则会失败。没有解决方案,因为输入正在获得焦点它是本机组件。失去焦点后,改回web组件类型为idcard。当digit不叫数字键盘时,无解。目前,只有数字在输入集中时有效。css动画不能做,否则input中的placeholder会错位,如果你既要动画又要焦点,可以在动画完成后设置焦点wood有问题,但在ios下无法识别。因为IOS下无法识别这种格式,所以需要2018/05/3000:00:00的格式。您可以使用正则表达式进行字符串替换,将破折号替换为斜杠。variosDate=date.replace(/-/g,'/');5.wx.getUserInfo()接口变化问题:最近微信小程序中抱怨最多的变化之一就是用户使用wx.getUserInfo(开发体验版)不会弹出授权,正式版不受影响。目前的授权方式是引导用户点击一个授权按钮,然后弹出授权。解决方案很长,请参考:微信小程序不支持wx.getUserInfo授权解决方案链接说明微信小程序不支持wx.getUserInfo授权解决方案getUserInfo兼容解决方案*只有debug模式才能给自己发数据其实,只要注意为官方服务器配置合法的域名,这个问题就会迎刃而解。有的时候因为一上来就开发,忘了把配置好的域名下掉。后来发现无法导出数据,可能想了很久忘记配置了!*部分小程序无法获取UnionID的问题。部分小程序获取不到UnionId的原因是向产品经理讲解技术:微信的openid和unionidlogin必须满足两个条件才能获取到UID:绑定小程序和公众号到开放平台;用户一定注意了公众号。用wx.getUserInfo获取满足一个条件:绑定小程序和公众号到开放平台;6、wx.getSystemInfoSync获取windowHeight不准确:主要原因是获取是时机,wx.getSystemInfoSync是在页面初始化的时候计算的,基本上可以理解为屏幕的高度。所以,最好的办法就是使用异步接口,在onReady函数中调用。onReady(){wx.getSystemInfo({success({windowHeight}){//todo}});}7.图片本地资源的名称,尽量使用小写命名:解决iPhoneX适配时,当底部多余的部分用图片路径是src='imgs/iphoneX.png'>我发现可以显示在pcIDE上,但是在真机调试的时候,图片如果找不到,那就把图片的名字改成iphonex.png,进行真机调试。8、小程序默认转发我们需要点击小程序右上角的...才能看到转发,无法引导用户。通常的做法是用一个按钮,设置open-type为share,这样就可以通过按钮开始分享。但是原生按钮比较丑,我们可以设置一张图片,wxml中的代码一般如下当然需要通过wxss去除按钮样式、背景、边框等,代码如下button{padding:0;保证金:0自动;宽度:70rpx;高度:70rpx;显示:块;边界:0;背景:透明;}button::after{border:0;}注意:尤其是button::after一定要设置,否则按钮的边框无法去除。