fix: 修复购物车总价和价格格式化中的空值问题
修复了购物车总价计算中可能存在的空值问题,确保当 `item.price` 或 `item.quantity` 为空时不会导致计算错误。同时,修复了价格格式化函数中对空值的处理,避免显示异常。
Showing
2 changed files
with
6 additions
and
5 deletions
| ... | @@ -93,7 +93,7 @@ export function provideCart(mode = CartMode.MULTIPLE) { | ... | @@ -93,7 +93,7 @@ export function provideCart(mode = CartMode.MULTIPLE) { |
| 93 | // 计算购物车总价 | 93 | // 计算购物车总价 |
| 94 | function getTotalPrice() { | 94 | function getTotalPrice() { |
| 95 | return cartItems.value.reduce( | 95 | return cartItems.value.reduce( |
| 96 | - (total, item) => total + item.price * item.quantity, | 96 | + (total, item) => total + ((item.price ?? 0) * (item.quantity ?? 0)), |
| 97 | 0 | 97 | 0 |
| 98 | ) | 98 | ) |
| 99 | } | 99 | } | ... | ... |
| ... | @@ -45,7 +45,7 @@ | ... | @@ -45,7 +45,7 @@ |
| 45 | <div class="flex flex-1"> | 45 | <div class="flex flex-1"> |
| 46 | <div class="w-12 h-12 rounded-lg overflow-hidden mr-3 flex-shrink-0"> | 46 | <div class="w-12 h-12 rounded-lg overflow-hidden mr-3 flex-shrink-0"> |
| 47 | <img | 47 | <img |
| 48 | - :src="item.imageUrl || '/assets/images/course-placeholder.jpg'" | 48 | + :src="item.cover || 'https://cdn.ipadbiz.cn/mlaj/images/default_block.png'" |
| 49 | :alt="item.title" | 49 | :alt="item.title" |
| 50 | class="w-full h-full object-cover" | 50 | class="w-full h-full object-cover" |
| 51 | @error="handleImageError" | 51 | @error="handleImageError" |
| ... | @@ -54,7 +54,7 @@ | ... | @@ -54,7 +54,7 @@ |
| 54 | <div class="flex-1"> | 54 | <div class="flex-1"> |
| 55 | <p class="font-medium text-sm line-clamp-1">{{ item.title }}</p> | 55 | <p class="font-medium text-sm line-clamp-1">{{ item.title }}</p> |
| 56 | <p class="text-xs text-gray-500"> | 56 | <p class="text-xs text-gray-500"> |
| 57 | - {{ item.type === 'course' ? '课程' : '活动' }} · {{ item.quantity }} 份 | 57 | + {{ item.type === 'course' ? '课程' : '活动' }} · {{ item?.quantity }} 份 |
| 58 | </p> | 58 | </p> |
| 59 | </div> | 59 | </div> |
| 60 | <button | 60 | <button |
| ... | @@ -72,7 +72,7 @@ | ... | @@ -72,7 +72,7 @@ |
| 72 | </button> | 72 | </button> |
| 73 | </div> | 73 | </div> |
| 74 | <div class="ml-2 text-right"> | 74 | <div class="ml-2 text-right"> |
| 75 | - <p class="font-medium text-sm">{{ formatPrice(item.price * item.quantity) }}</p> | 75 | + <p class="font-medium text-sm">{{ formatPrice(item?.price * item.quantity) }}</p> |
| 76 | <p class="text-xs text-gray-500">{{ formatPrice(item.price) }} / 份</p> | 76 | <p class="text-xs text-gray-500">{{ formatPrice(item.price) }} / 份</p> |
| 77 | </div> | 77 | </div> |
| 78 | </div> | 78 | </div> |
| ... | @@ -302,7 +302,8 @@ const itemToDelete = ref(null) | ... | @@ -302,7 +302,8 @@ const itemToDelete = ref(null) |
| 302 | 302 | ||
| 303 | // Format price with Chinese Yuan symbol | 303 | // Format price with Chinese Yuan symbol |
| 304 | const formatPrice = (price) => { | 304 | const formatPrice = (price) => { |
| 305 | - return `¥${price.toFixed(2)}` | 305 | + if (!price && price !== 0) return '¥0.00' |
| 306 | + return `¥${Number(price).toFixed(2)}` | ||
| 306 | } | 307 | } |
| 307 | 308 | ||
| 308 | // Handle image error | 309 | // Handle image error | ... | ... |
-
Please register or login to post a comment