海阔天空.
海阔天空.

小程序踩坑总结

1.长按保存图片，我们遇到过：IOS什么都不用做长按就会弹出保存的弹窗，安卓却不会。在此总结两种方式：

1）监听图片的点击（tap）或长按（longpress）事件，调用小程序预览图片api，再长按就可以保存了，除了保存还能实现识别图中小程序码（不是同个主体的小程序码也能跳转）、发送给朋友等功能。备注：不需要用户授权

scan:function(e){
  　　var current = e.target.dataset.src;
      console.log(current, 'current')
  　　wx.previewImage({
  　　　　current: current,//当前显示图片的http链接，我这边是把图片转成了base64
  　　　　urls: [current] //需要预览的图片http链接列表
  　　})
  },

小程序踩坑总结_第1张图片

2）监听图片的点击（tap）或长按（longpress）事件，调用小程序保存到相册api. 备注：此法只有保存功能，必须要用户授权。 

    scan: function() {
      wx.getImageInfo({
        src: '../../pic_home_sao2.png',
        success: function (res) {
          console.log(res);
          var path = res.path;
          wx.saveImageToPhotosAlbum({
            filePath: path,
            success: function (res) {
              console.log('图片已保存');
            },
            fail: function (res) {
              console.log('保存失败');
            }
          })
        }
      });
    },

小程序踩坑总结_第2张图片

2.轮播图不显示，可能是没有给外层容器设置高度

swiper {
  width: 100vw;
  height: 254rpx;
  .slide-image {
    width: 100%;
    height: 100%;
  }
}

3.水平滚动没有效果，外层容器需要设置为white-space: nowrap;  子项需要设置display: inline-block;

     
          xxx
        


    .type {
      width: xxx;
      white-space: nowrap;
      .item {
        display: inline-block;
        ...
      }
    }

4.小程序rich-text组件解析富文本，安卓上图片无法长按保存到本地 通过使用富文本插件 Parse 来解析富文本可以解决

5.改变小程序右上角自带的“胶囊”颜色 通过设置navigationBarTextStyle属性。

6.wepy2中引入vant组件方式 例： "van-overlay": "module:@vant/weapp/dist/overlay"

7.如何让遮罩全屏（顶部和底部tabBar一起遮住），1.自定义顶部可以让顶部被遮住 2.对于底部有两种方式： 1）不用自带的tabBar，自定义组件模拟其功能 2）折中办法 在遮罩弹起的时候调用wx.hideTabBar隐藏tabBar, 关闭时再调wx.showTabBar显示

8.position:absolute 有时变成了fixed的效果，场景是我相对页面定位，没有给包裹元素设置 position: relative，设置一下就可以解决。

9.textarea placeholder设置样式无效，我的场景是在vant-weapp的popup组件中使用。解决办法：一开使用view标签模拟，点击之后显示textarea。(用的wepy框架所以可以用html标签及类似vue语法)

            
请补充您要说明的原因