fixed

pages/blog/bloginfo.vue

@@ -41,6 +41,22 @@
 							<rich-text :nodes="contentDate" class="ql-editor"></rich-text>
 						</view>
 				</view>
+				<!-- 截图展示 -->
+				<view v-if="blogInfo.picList && blogInfo.picList.length > 0" class="titel-felx">
+					<view class="time-img">
+						<image class="ui-img" src="https://img.yidaima.cn/feastwenjian.svg" mode=""></image>
+					</view>
+					<view class="titel-h-go">
+						项目截图
+					</view>
+				</view>
+				<view v-if="blogInfo.picList && blogInfo.picList.length > 0" class="screenshot-view">
+					<view class="screenshot-list">
+						<view v-for="(item, index) in blogInfo.picList" :key="index" class="screenshot-item" @click="previewImage(index)">
+							<image class="screenshot-img" :src="item" mode="aspectFill"></image>
+						</view>
+					</view>
+				</view>
 				<!-- 猜你想搜 -->
 				<view class="titel-felx">
 					<view class="time-img">
@@ -434,7 +450,14 @@
 						}
 					}, 1000);
 				},
+				// 图片预览
+				previewImage(index) {
+					uni.previewImage({
+						urls: this.blogInfo.picList,
+						current: index
+					});
 				}
+			},
 		}
 </script>
 
@@ -595,6 +618,28 @@
 		word-wrap: break-word;
 	}
 
+	.screenshot-view {
+		margin: 20upx;
+	}
+
+	.screenshot-list {
+		display: flex;
+		flex-wrap: wrap;
+		justify-content: space-between;
+	}
+
+	.screenshot-item {
+		width: 48%;
+		margin-bottom: 20upx;
+		border-radius: 10upx;
+		overflow: hidden;
+	}
+
+	.screenshot-img {
+		width: 100%;
+		height: 200upx;
+	}
+
 	.list-li-left-describe {
 		text-overflow: ellipsis;
 		display: -webkit-box;