Jelajahi Sumber

style(uvue): 优化图片加载和代码格式

1. 移除mix.uvue中多余的config.baseUrl图片前缀拼接
2. 给多个image组件添加lazy-load懒加载属性
3. 清理多余的空格缩进
408249787@qq.com 1 Minggu lalu
induk
melakukan
62dbf36a11
2 mengubah file dengan 5 tambahan dan 5 penghapusan
  1. 1 1
      pages/index/components/mix.uvue
  2. 4 4
      pages/index/home.uvue

+ 1 - 1
pages/index/components/mix.uvue

@@ -38,7 +38,7 @@ function handleDetail(item: any) {
     <scroll-view class="scroll-view_H" direction="horizontal" :show-scrollbar="false">
       <view class="scroll-view-item_H bg-[white]" v-for="course in dataList || []" :key="course.id"
         @tap="handleDetail(course)">
-        <cl-image :src="config.baseUrl + course?.iconPath" mode="heightFix"
+        <cl-image :src="course?.iconPath" mode="heightFix"
           class="!w-full !h-[26vh] mb-[2px] rounded-xl"></cl-image>
         <text class="text-[4vh] font-bold">{{
           course.mainTitle }}</text>

+ 4 - 4
pages/index/home.uvue

@@ -76,16 +76,16 @@ function copyUrl() {
 </script>
 <template>
 	<cl-page :backTop="false">
-		<image src="https://oss.xiaoxiongcode.com/static/home/111.png" mode="aspectFill" alt=""
+		<image src="https://oss.xiaoxiongcode.com/static/home/111.png" mode="aspectFill" lazy-load alt=""
 			class="w-full h-full object-cover absolute top-0 left-0" />
 		<view class="menus w-[90vw]">
-			<image src="https://oss.xiaoxiongcode.com/static/home/643.png"
+			<image lazy-load src="https://oss.xiaoxiongcode.com/static/home/643.png"
 				class="w-[90vw] h-[24vh] absolute top-0 left-0 z-[1]"></image>
 			<view class="w-[87vw] relative z-[2] p-1 px-3 flex flex-row items-center justify-between gap-1 mx-auto ">
 				<view v-for="item in menuList" :key="item.code"
 					class="flex flex-col items-center p-1 px-4 justify-center gap-1  transition-all duration-300"
 					@tap="handlePage(item)" :class="{ 'selected': item.code === selected }">
-					<image :src="icons[item.code]" mode="aspectFill" class="w-[4vw] h-[4vw]"></image>
+					<image lazy-load :src="icons[item.code]" mode="aspectFill" class="w-[4vw] h-[4vw]"></image>
 					<text class="text-[1.5vw] text-[#1E1E1E]">{{ item.label }}</text>
 				</view>
 
@@ -97,7 +97,7 @@ function copyUrl() {
 				@tap="visible = true">
 				<view class="bg-[#09ba07] p-[1vw] rounded-full w-[40px] h-[40px] flex items-center justify-center"
 					@tap="visible = true">
-					<cl-icon name="customer-service-line"  :size="20" color="#FFF"></cl-icon>
+					<cl-icon name="customer-service-line" :size="20" color="#FFF"></cl-icon>
 				</view>
 			</view>
 		</cl-float-view>