You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
shop-pc/components/UIGoodsInfo.vue

57 lines
994 B

<!--
* @Author: ch
* @Date: 2022-05-08 14:41:42
* @LastEditors: ch
3 years ago
* @LastEditTime: 2022-05-12 10:00:52
* @Description: file content
-->
<template>
3 years ago
<div class="ui-goods-info" @click="$router.push(`/goods/detail/${goods.productId}`)">
<div class="ui-goods-info--img">
<img :src="goods.productImageUrl"/>
</div>
<p>
<b>{{goods.productName}}</b>
<span>{{goods.skuDescribe}}</span>
</p>
</div>
</template>
<script>
export default {
props : {
goods : {
type : Object,
default : () => ({})
}
}
}
</script>
<style lang="scss" scoped>
.ui-goods-info{
display: flex;
3 years ago
cursor: pointer;
&--img{
width: 100px;
height: 100px;
border: 1px solid #eee;
}
p{
width: 270px;
margin: 7px 0 0 18px;
text-align: left;
b{
display: block;
line-height: 22px;
margin-bottom: 10px;
overflow: hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
span{
color: #999;
}
}
}
</style>