微信小程序开发之填坑之旅

2024年4月9日 216次阅读 来源: silverWinter

微信小程序日益发展成熟，刚实战开发完小程序，记录一下项目过程中遇到的问题点，帮助和我遇到同样问题的人～😄，话不多说，切入主题：

  • scroll-view组件

该组件用来创建可滚动视图区域，这样就不用自己写一个wrapper，可是，总会遇到一些奇特的需求，一般都是去掉滚动条，我这个是偏要显示滚动条，scroll-view在模拟器上滚动条能正常显示，可是到真机上，滚动条滑一下就没掉了，那只能自己写个wrapper再加上滚动条样式了

wxml:
     <view class='wrapper'>
       <view class='cont-wrapper'>
       </view>
     </view>  
wxss:
.wrapper {
  height: 100%;
  width:90%;
  margin:0 auto;
  box-shadow: 1rpx 1rpx 3rpx #eaeaeb;
  border: 1rpx solid #eaeaeb;
}
.cont-wrapper{
  background: #fff;
  overflow: hidden;
  height: 80%; 
  overflow-y:scroll;
 }
::-webkit-scrollbar {
     width: 6px;
}
::-webkit-scrollbar-track {
     background: #fff;
     border-radius: 0px;
}
::-webkit-scrollbar-thumb {
     border-radius: 0px;
     background: #999;
}
  • camera与弹框的bug

由于采集身份证信息的，需要采集身份证照片，采用了拍照功能，camera拍照会有声音，这个至今还没解决，有解决的麻烦告诉我一声，😁，页面首次加载进来，尽管用了cover-view弹框首次进入该页面还是无法覆盖掉camera组件，第二次可以正常覆盖，无奈之下，只能在用户关闭弹框，将camera打开，如果有更好的解决办法，在线告知一下～😂

  • 弹框无法覆盖textarea以及textarea的自动换行bug

     wxml:
 <textarea   type='text' auto-height='true' class='correct' value="{{hasJump?'':liveAddrress}}" maxlength="40" fixed="{{tag}}"></textarea>
 wxss:
  textarea{
     width:auto;
     min-height: 24rpx;
     padding: 27rpx 27rpx;
     background-color:#fbfbfb;
     border:1rpx solid #d2d2d2;
     color:#000;
     font-size:24rpx;
   }

设置textarea自动增高，height就会失效，首次又不想height太高，只能通过min-height来设置高度，fixed设置false需要通过变量控制，fixed=”false”这样行不通，textarea 组件是由客户端创建的原生组件，它的层级是最高的，不能通过 z-index 控制层级。请勿在 scroll-view、swiper、picker-view、movable-view 中使用 textarea 组件。弹框无法覆盖textarea组建文字，通过弹框出现之前隐藏textarea的value值
后续再补充～一下想不起来

    原文作者：silverWinter
    原文地址: https://segmentfault.com/a/1190000015760161
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞