小程序开发遇到的坑及解决-优快云博客

本文分享了小程序开发的实用技巧，包括第三方组件样式修改，如iview webapp通过i-class修改；使用wepy时异步更新数据手动刷新dom用this.$apply()；循环渲染用<repeat>标签；还提及语音功能、帮助文档展示、地图绘制、转发及获取位置授权等相关内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1，第三方组件样式修改:

　　以iview webapp为例，不能直接通过其class的类名直接修改组件样式，可通过i-class来给组件添加类名，通过i-class来修改样式。

<i-page i-class="ipage" current="{{ page }}" total="{{ total }}" bind:change="handleChange">
   <view slot="prev">
        <i-icon type="return"></i-icon>
          上一页
       </view>
       <view slot="next">
          下一页
       <i-icon type="enter"></i-icon>
   </view>
</i-page>

<style>
.ipage{
  height: 64px!important;
}
</style>

2，使用wepy时，异步更新数据，手动刷新dom的时候需要使用this.$apply()

3，当需要循环渲染WePY组件时(类似于通过wx:for循环渲染原生的wxml标签)，必须使用WePY定义的辅助标签<repeat>

 <!-- 注意，使用for属性，而不是使用wx:for属性 -->
    <repeat for="{{list}}" key="index" index="index" item="item">
    </repeat>

4,小程序语音功能，通过同声传译插件

https://developers.weixin.qq.com/community/develop/doc/0004aa70d609e099c1d671b2a56009

5,帮助文档通过web-view组件展示

6,地图上绘制多边形和点直接使用map组件相应的能力

7,转发功能:

wx.showShareMenu({
   withShareTicket: true
})

8,主动获取位置授权：

https://developers.weixin.qq.com/community/develop/doc/000cea2305cc5047af5733de751008

<button bindtap="openSetting">打开设置页</button>  openSetting() {  wx.openSetting()}

转载于:https://www.cnblogs.com/liuwei54/p/10906002.html