记录微信小程序项目遇到的几个问题

问题一：滑动首页时，会出现搜索框和卡片内容重叠。设置z-index也没用

解决方案：

我用的标签是uniapp中的cover-image，把cover-image改为image标签就好了
推断cover-image应该小程序有兼容问题

问题二：首页头部自动播放时轮播图片banner滚动卡顿

解决方案：

也是把uniapp中的cover-image标签改为image标签就好了

问题三：ios系统苹果手机，页面上下左右滑动会晃动，需固定上下左右，安卓系统不会

ios系统上下滑动会出现这种情况，像是可以晃动，有点像刷新的效果，但不是，刷新是白色的

左右也是

解决方案：在页面最外层标签上加上以下css样式：

加上以后上下左右都固定，不会晃动：

overflow-x: hidden;
overflow-y: hidden;

问题四：除广州地区，选择其他地区后再选择其他地区时均有下拉不下去的现象，

解决方案：最外层给个高度

因为没有具体公司位子的时候,白色部分就只有一点,是超出隐藏了，不是下拉不了,是显示不全，高度的问题，因为在最外层标签加上了“问题三”的 overflow-x: hidden; overflow-y: hidden;样式，
所以这里受影响了，应该在最外层加个自适应的高度样式

<view class="background" :style="{height : wh + 'px'}">
</view>
1
2

export default {

		data() {
			return {
				// 当前屏幕可用宽度
				wh: 0,
				}
			}
	}
1
2
3
4
5
6
7
8
9

onLoad() {
		 	const sysInfo = uni.getSystemInfoSync()
			this.wh = sysInfo.windowHeight
	}
1
2
3
4

问题五：超出字段需后面需用省略号表示

解决方案：

<text class="list_font">
	{{itemspot.title |   ellipsis(itemspot.title)}}
</text>
1
2
3

filters: {
	    /**
	     * 文件名超出18个字符后显示省略号
	     */
	    ellipsis(value) {
	        if (!value) return ''
	        if (value.length > 18) {
	            return value.slice(0, 18) + '...'
	        }
	        return value
	    }
	},
1
2
3
4
5
6
7
8
9
10
11
12

额外加个分享功能：

//发送给朋友
		onShareAppMessage(res) {
			// console.log(res)
			return {
				title: this.toolsName.name,//设置分享出去的标题
				path: '/filepage/tool_detail/tool_detail?parentId=' + this.parentIds,//详情页面带参数分享
				imageUrl: this.imageUrl,//设置分享出去显示的图片
				// desc: this.sharedata.desc,
				// content: this.sharedata.content,
				success(res) {
					uni.showToast({
						title: '分享成功'
					})
				},
				fail(res) {
					uni.showToast({
						title: '分享失败',
						icon: 'none'
					})
				}
			}
		},
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22