fix: image close tag

pages/index/index --lod.vue

@@ -1,241 +1,228 @@
 <template>
-	<view class="container">
-		<image class="headImg" mode="aspectFill" :src="$fileUrl() + '/homeHead.jpeg'"></image>
-		<view class="headBarrage">
-
-		</view>
-
-		<view class="tabs">
-			<view class="tab">
-				<image :src="$fileUrl() + '/Frame3.png'" alt="">
-					<span>全部</span>
-			</view>
-			<view class="tab" @click="$navigateTo('/pages/excellentValue/excellentValue')">
-				<image :src="$fileUrl() + '/Frame4.png'" alt="">
-					<span>超值挑战</span>
-			</view>
-			<view class="tab">
-				<image :src="$fileUrl() + '/Frame2.png'" alt="">
-					<span>拍卖专区</span>
-			</view>
-			<view class="tab">
-				<image :src="$fileUrl() + '/Frame1.png'" alt="">
-					<span>VIP福利</span>
-			</view>
-		</view>
-		<view class="buttons">
-			<view class="left">
-				<image :src="$fileUrl() + '/button3.png'" @click="toInvite"></image>
-			</view>
-			<view class="right">
-				<image :src="$fileUrl() + '/button1.png'"></image>
-				<image :src="$fileUrl() + '/button2.png'"
-					@click="$navigateTo('/pages/raffle/raffle')"></image>
-			</view>
-		</view>
-		<view class="list-title">
-			- 热门推荐 -
-		</view>
-		<view class="list">
-			<view class="ka" v-for="(item, index) in kaList">
-				<view class="top">
-					<image mode="aspectFit" :src="$fileUrl() + '/ka.jpeg'"></image>
-				</view>
-				<view class="ka-info">
-					<view class="ka-name">
-						宝可梦简中原盒拆拆乐
-					</view>
-					<view class="row">
-						<uni-tag text="创意热销" inverted type="default"></uni-tag>
-						<view class="money">
-							¥9.9
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view class="container">
+    <image class="headImg" mode="aspectFill" :src="$fileUrl() + '/homeHead.jpeg'"></image>
+    <view class="headBarrage"></view>
+
+    <view class="tabs">
+      <view class="tab">
+        <image :src="$fileUrl() + '/Frame3.png'" alt="" />
+        <span>全部</span>
+      </view>
+      <view class="tab" @click="$navigateTo('/pages/excellentValue/excellentValue')">
+        <image :src="$fileUrl() + '/Frame4.png'" alt="" />
+        <span>超值挑战</span>
+      </view>
+      <view class="tab">
+        <image :src="$fileUrl() + '/Frame2.png'" alt="" />
+        <span>拍卖专区</span>
+      </view>
+      <view class="tab">
+        <image :src="$fileUrl() + '/Frame1.png'" alt="" />
+        <span>VIP福利</span>
+      </view>
+    </view>
+    <view class="buttons">
+      <view class="left">
+        <image :src="$fileUrl() + '/button3.png'" @click="toInvite"></image>
+      </view>
+      <view class="right">
+        <image :src="$fileUrl() + '/button1.png'"></image>
+        <image :src="$fileUrl() + '/button2.png'" @click="$navigateTo('/pages/raffle/raffle')" />
+      </view>
+    </view>
+    <view class="list-title">- 热门推荐 -</view>
+    <view class="list">
+      <view class="ka" v-for="(item, index) in kaList">
+        <view class="top">
+          <image mode="aspectFit" :src="$fileUrl() + '/ka.jpeg'"></image>
+        </view>
+        <view class="ka-info">
+          <view class="ka-name">宝可梦简中原盒拆拆乐</view>
+          <view class="row">
+            <uni-tag text="创意热销" inverted type="default"></uni-tag>
+            <view class="money">¥9.9</view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	import {
-		messageListApi
-	} from "@/api/common.js"
-	export default {
-		data() {
-			return {
-				kaList: 6,
-				messageList: [],
-				barrageData: [],
-				barrageIndex: 0,
-				timeOut: null,
-			}
-		},
-		onLoad(query) {
-			if (query.inviteId) {
-				getApp().globalData.inviteId = query.inviteId;
-			} else {
-				const scene = decodeURIComponent(query.scene)
-				let inviteId = scene.split("=")[1]
-				console.log(inviteId, 'inviteId')
-				getApp().globalData.inviteId = inviteId;
-			}
-		},
-		onShow() {
-			this.getMessage()
-		},
-		methods: {
-			getMessage() {
-				let params = {
-					limit: 20,
-					page: 1,
-				}
-				messageListApi(params).then(res => {
-					this.messageList = res.data.list
-					this.initBarrage()
-				})
-			},
-			// 初始化弹幕
-			initBarrage() {
-				
-			},
-			toInvite() {
-				wx.navigateTo({
-					url: '/pages/invite/invite'
-				})
-			}
-		}
-	}
+import { messageListApi } from '@/api/common.js'
+export default {
+  data() {
+    return {
+      kaList: 6,
+      messageList: [],
+      barrageData: [],
+      barrageIndex: 0,
+      timeOut: null,
+    }
+  },
+  onLoad(query) {
+    if (query.inviteId) {
+      getApp().globalData.inviteId = query.inviteId
+    } else {
+      const scene = decodeURIComponent(query.scene)
+      let inviteId = scene.split('=')[1]
+      console.log(inviteId, 'inviteId')
+      getApp().globalData.inviteId = inviteId
+    }
+  },
+  onShow() {
+    this.getMessage()
+  },
+  methods: {
+    getMessage() {
+      let params = {
+        limit: 20,
+        page: 1,
+      }
+      messageListApi(params).then(res => {
+        this.messageList = res.data.list
+        this.initBarrage()
+      })
+    },
+    // 初始化弹幕
+    initBarrage() {},
+    toInvite() {
+      wx.navigateTo({
+        url: '/pages/invite/invite',
+      })
+    },
+  },
+}
 </script>
 
 <style scoped lang="scss">
-	.container {
-		/* padding: 20px; */
-		font-size: 14px;
-		line-height: 24px;
-	}
-
-	.headImg {
-		height: 180px;
-		width: 100%;
-	}
-	.headBarrage {
-		height: 180px;
-		width: 100%;
-		position: absolute;
-		top: 0;
-	}
-
-	.tabs {
-		display: flex;
-		justify-content: space-around;
-		margin-top: 10px;
-
-		>.tab {
-			width: 20%;
-			display: flex;
-			flex-direction: column;
-			justify-content: center;
-			align-items: center;
-
-			>image {
-				width: 40px;
-				height: 40px;
-			}
-		}
-	}
-
-	.buttons {
-		margin-top: 5px;
-		padding: 10px;
-		display: flex;
-		justify-content: space-between;
-
-		>.left {
-			width: calc(50vw - 15px);
-			height: 40vw;
-
-			image {
-				width: 100%;
-				height: 100%;
-			}
-		}
-
-		>.right {
-			width: calc(50vw - 15px);
-			height: 40vw;
-			display: flex;
-			flex-direction: column;
-			justify-content: space-between;
-			align-items: center;
-
-			image {
-				width: 100%;
-				height: calc(50% - 5px);
-			}
-		}
-	}
-
-	.list-title {
-		font-size: 16px;
-		font-weight: 600;
-		text-align: center;
-		padding: 10px;
-	}
-
-	.list {
-		display: grid;
-		grid-template-columns: 1fr 1fr;
-		grid-gap: 10px;
-		padding: 10px;
-
-		.ka {
-			width: calc(50vw - 15px);
-			box-shadow: 0px 2px 8px 2px rgba(0, 0, 0, 0.1);
-			border-radius: 10px;
-			// height: 60vw;
-
-			.top {
-				// height: 60vw;
-				background: linear-gradient(180deg, #FAF1A7 0%, #FFE456 100%);
-				text-align: center;
-				display: flex;
-				justify-content: center;
-
-				image {
-					width: 35vw;
-					height: 50vw;
-				}
-			}
-
-			.ka-info {
-				padding: 10px;
-
-				.ka-name {
-					font-size: 15px;
-					font-weight: 600;
-				}
-
-				.row {
-					margin-top: 5px;
-					display: flex;
-					justify-content: space-between;
-
-					.money {
-						font-size: 16px;
-						font-weight: 600;
-						color: #FF2C43;
-					}
-				}
-			}
-		}
-	}
-	.bullet {
-		height: 30px;
-		line-height: 30px;
-		padding: 0 10px;
-		border-radius: 15px;
-		background-color: rgba(0, 0, 0, 0.3);
-		color: #fff;
-	}
-</style>
+.container {
+  /* padding: 20px; */
+  font-size: 14px;
+  line-height: 24px;
+}
+
+.headImg {
+  height: 180px;
+  width: 100%;
+}
+.headBarrage {
+  height: 180px;
+  width: 100%;
+  position: absolute;
+  top: 0;
+}
+
+.tabs {
+  display: flex;
+  justify-content: space-around;
+  margin-top: 10px;
+
+  > .tab {
+    width: 20%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+
+    > image {
+      width: 40px;
+      height: 40px;
+    }
+  }
+}
+
+.buttons {
+  margin-top: 5px;
+  padding: 10px;
+  display: flex;
+  justify-content: space-between;
+
+  > .left {
+    width: calc(50vw - 15px);
+    height: 40vw;
+
+    image {
+      width: 100%;
+      height: 100%;
+    }
+  }
+
+  > .right {
+    width: calc(50vw - 15px);
+    height: 40vw;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    align-items: center;
+
+    image {
+      width: 100%;
+      height: calc(50% - 5px);
+    }
+  }
+}
+
+.list-title {
+  font-size: 16px;
+  font-weight: 600;
+  text-align: center;
+  padding: 10px;
+}
+
+.list {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  grid-gap: 10px;
+  padding: 10px;
+
+  .ka {
+    width: calc(50vw - 15px);
+    box-shadow: 0px 2px 8px 2px rgba(0, 0, 0, 0.1);
+    border-radius: 10px;
+    // height: 60vw;
+
+    .top {
+      // height: 60vw;
+      background: linear-gradient(180deg, #faf1a7 0%, #ffe456 100%);
+      text-align: center;
+      display: flex;
+      justify-content: center;
+
+      image {
+        width: 35vw;
+        height: 50vw;
+      }
+    }
+
+    .ka-info {
+      padding: 10px;
+
+      .ka-name {
+        font-size: 15px;
+        font-weight: 600;
+      }
+
+      .row {
+        margin-top: 5px;
+        display: flex;
+        justify-content: space-between;
+
+        .money {
+          font-size: 16px;
+          font-weight: 600;
+          color: #ff2c43;
+        }
+      }
+    }
+  }
+}
+.bullet {
+  height: 30px;
+  line-height: 30px;
+  padding: 0 10px;
+  border-radius: 15px;
+  background-color: rgba(0, 0, 0, 0.3);
+  color: #fff;
+}
+</style>