首页初次对接口

pages/detail/productsDetail/productsDetail.vue

@@ -1,7 +1,8 @@
 <template>
 	<view>
-		<view v-for="(item,index) in detailList" :key="index">
-			<u-swiper :list="swiperList" indicatorMode="line " width="750rpx" height="530rpx" radius="0" circular>
+		<view :key="index">
+			<u-swiper :list="detailList.images" indicatorMode="line " width="750rpx" height="530rpx" radius="0"
+				circular>
 			</u-swiper>
 			<view class="collect">
 				<view class="star">
@@ -19,19 +20,19 @@
 
 			<view class="content">
 				<view class="title_box">
-					<text class="title">{{item.title}}</text>
-					<view class="title_tag">{{item.tag}}</view>
+					<text class="title">{{detailList.name}}</text>
+					<view class="title_tag">{{detailList.cate_bname}}</view>
 				</view>
 				<view class="desc">
-					{{item.desc}}
+					{{detailList.title}}
 				</view>
 				<view class="classify">
-					{{item.classify}}
+					{{detailList.cate_name}}
 				</view>
 				<view class="tag_view">
 					<view>
-						<text class="tagOne">{{item.tagOne}}</text>
-						<text class="tagTwo">{{item.tagTwo}}</text>
+						<text class="tagOne">{{detailList.tags}}</text>
+						<!-- <text class="tagTwo">{{item.tagTwo}}</text>  v-for="item in detailList.tags" :key="item.id" -->
 					</view>
 					<view v-if="isThumb==false" class="heart">
 						<u-image v-if="showHeart==false" src="/static/detail/xp_icon_heart.png" width="34rpx"
@@ -45,7 +46,7 @@
 					<view v-if="isThumb==true" class="heart">
 						<u-image src="/static/detail/xp_icon_ysc.png" width="34rpx" height="32rpx" @click="heartTap">
 						</u-image>
-						<text class="thumb">122赞</text>
+						<text class="thumb">{{detailList.thumb}}赞</text>
 					</view>
 				</view>
 			</view>
@@ -54,9 +55,9 @@
 				<u-image src="/static/products/xp_icon_sjf.png" width="24rpx" height="24rpx">
 				</u-image>
 				<text class="release">发布日期：</text>
-				<text>{{item.time}}</text>
+				<text>{{detailList.pub_time}}</text>
 			</view>
-			<u-parse :content="item.content" @preview="preview" @navigate="navigate"></u-parse>
+			<u-parse :content="detailList.desc" @preview="preview" @navigate="navigate"></u-parse>
 		</view>
 
 	</view>
@@ -66,26 +67,44 @@
 	export default {
 		data() {
 			return {
+				id: '',
 				showStar: false,
 				showHeart: false,
-				isThumb: true,
-				detailList: [{
-					title: '锅巴',
-					tag: '零食铺子',
-					desc: '糯米蟹黄锅巴散装，非油炸绿色健康食品',
-					classify: '薯片膨化',
-					tagOne: '无添加剂1',
-					tagTwo: '无添加剂',
-					time: '2022年12月04日',
-					content: '<h1>一级标题</h1><br/><h2>二级标题</h2>'
-				}],
+				isThumb: false,
+				detailList: [
+					// 	{
+					// 	title: '锅巴',
+					// 	tag: '零食铺子',
+					// 	desc: '糯米蟹黄锅巴散装，非油炸绿色健康食品',
+					// 	classify: '薯片膨化',
+					// 	tagOne: '无添加剂1',
+					// 	tagTwo: '无添加剂',
+					// 	time: '2022年12月04日',
+					// 	content: '<h1>一级标题</h1><br/><h2>二级标题</h2>'
+					// },
+				],
 				swiperList: [
 					'/static/detail/zhanwei_xppx.png',
 					'/static/detail/zhanwei_xppx.png'
 				]
 			}
 		},
+		onLoad(option) {
+			console.log('产品id', option.id);
+			this.id = option.id
+			this.getProductDetail()
+		},
 		methods: {
+			//获取详情信息
+			getProductDetail() {
+				this.$apiServe.getProductDetail(this.id).then(res => {
+					// console.log('详情页', res.data.data.thumb)
+					if (res.data.data.thumb) {
+						this.isThumb = true
+					}
+					this.detailList = res.data.data
+				}).finally(_ => {})
+			},
 			//收藏按钮
 			starTap() {
 				this.showStar = !this.showStar