修复了图片不显示的bug

src/views/ProductSummary.vue

@@ -40,7 +40,8 @@
           indicator-position="outside"
           style="min-height: 300px;"
         >
-          <el-carousel-item v-for="(image, index) in product.images" :key="index">
+          <!-- <el-carousel-item v-for="(image, index) in product.images" :key="index"> -->
+          <el-carousel-item v-for="(image, index) in (productDetailsCache[product.id]?.images || [])" :key="index">
             <img :src="image" :alt="product.name" class="carousel-image" />
           </el-carousel-item>
         </el-carousel>
@@ -71,6 +72,8 @@ import {Bottom, ShoppingCart} from "@element-plus/icons-vue";
 
 const products = ref([])
 const firstProduct = ref([])
+const productDetail = ref([])
+const productDetailsCache = ref({}) // 缓存所有商品详情
 
 const route = useRoute()
 const productId = ref(null)
@@ -105,6 +108,9 @@ const getProducts = async () => {
     
     console.log('解析后的商品数据:', products.value)
     
+    // 预加载所有商品详情
+    await loadAllProductDetails()
+    
   } catch (error) {
     console.error('获取商品失败:', error)
     console.error('错误详情:', error.response?.data)
@@ -127,6 +133,41 @@ const getFirstProduct = async () => {
   }
 }
 
+const getProductDetail = async (productId) => {
+  try {
+    const response = await api.get(`/products/${productId}`)
+    
+    if (response.data && response.data.data && response.data.data.product) {
+      productDetail.value = response.data.data.product
+      // 缓存商品详情
+      productDetailsCache.value[productId] = response.data.data.product
+    } else {
+      console.error('无法解析商品详情数据:', response.data)
+      ElMessage.error('获取商品详情失败')
+    }
+    
+    return productDetail.value
+  } catch (error) {
+    console.error('获取商品详情失败:', error)
+    console.error('错误详情:', error.response?.data)
+    ElMessage.error('获取商品详情失败')
+    throw error
+  }
+}
+
+// 预加载所有商品详情的函数
+const loadAllProductDetails = async () => {
+  const uniqueProductIds = [...new Set(products.value.map(p => p.id))]
+  
+  for (const id of uniqueProductIds) {
+    try {
+      await getProductDetail(id)
+    } catch (error) {
+      console.warn(`Failed to load details for product ${id}:`, error)
+    }
+  }
+}
+
 // 添加生命周期钩子来调用函数
 onMounted(() => {
   productId.value = route.params.id