微信小程序|小程序踩坑总结
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链接列表
})
},
文章图片
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.轮播图不显示，可能是没有给外层容器设置高度
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语法)
请补充您要说明的原因
onPlaceholderTap() {
this.showPlaceholder = false;
}10. 小程序自定义字体
1）把自定义字体转为base64工具
2).wxss自定义字体
@font-face {
font-family: 'Biko';
src: url(data:application/octet-stream;
base64,T1RUTwALAIAAAwAwQ0ZGIHhTaRQAAG8sAAA6XUdQT1OGj4AfAAArOAAAQ/RPUy8yhgs32AAAASAAAABgY21hcESoJ5AAAAgsAAAFHmhlYWT9k略
}用到的页面引入使用
@import '../assets/style/biko.wxss';
.english {
font-family: Biko;
}11.小程序接入第三方客服 美恰
按美恰文档配置好后(关于配置有疑问也可以向美恰客服咨询)，小程序用户的客服消息都会转发到美恰。使用很简单，小程序button组件就可以打开客服会话。
12.小程序隐藏滚动条
很多说法是后3行就可以，但IOS有时候无效，加上display:none 就好了
::-webkit-scrollbar {
display: none;
width: 0;
height: 0;
color: transparent;
}推荐阅读
- 一个小故事，我的思考。
- 家乡的那条小河
- 一个人的碎碎念
- 野营记-第五章|野营记-第五章 讨伐梦魇兽
- 昨夜小楼听风
- 2021-02-17|2021-02-17 小儿按摩膻中穴-舒缓咳嗽
- 基于微信小程序带后端ssm接口小区物业管理平台设计
- 2019.4.18感恩日记
- 那件我们忽略的小事叫感恩
- 你有婚内虐待行为吗（）