|
|
|
@ -0,0 +1,78 @@ |
|
|
|
<template> |
|
|
|
<view> |
|
|
|
<view class="content"> |
|
|
|
<view class="card" v-for="item in 7" :key="item"> |
|
|
|
<lf-image class="cover" src="../../static/logo.png"></lf-image> |
|
|
|
<view class="label"> |
|
|
|
<view class="lf-line-1">嘉宾xxx <text>男</text></view> |
|
|
|
<view class="lf-line-1">25岁·牛·180cm·本科·未婚</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- 加载更多 --> |
|
|
|
<view class="loading-more"> |
|
|
|
<text>没有更多数据啦~</text> |
|
|
|
</view> |
|
|
|
<!-- 回到顶部 --> |
|
|
|
<u-back-top :scrollTop="pageScrollTop"></u-back-top> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
export default { |
|
|
|
data(){ |
|
|
|
return { |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad(){ |
|
|
|
|
|
|
|
}, |
|
|
|
methods: { |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang="scss" scoped="scoped"> |
|
|
|
.content{ |
|
|
|
display: flex; |
|
|
|
flex-wrap: wrap; |
|
|
|
padding: 44rpx 32rpx; |
|
|
|
} |
|
|
|
.card{ |
|
|
|
width: 334rpx; |
|
|
|
height: 360rpx; |
|
|
|
border-radius: 10rpx; |
|
|
|
position: relative; |
|
|
|
overflow: hidden; |
|
|
|
margin-right: 18rpx; |
|
|
|
margin-bottom: 18rpx; |
|
|
|
&:nth-child(2n){ |
|
|
|
margin-right: 0rpx; |
|
|
|
} |
|
|
|
.cover{ |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
background-color: #EEEEEE; |
|
|
|
position: absolute; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
} |
|
|
|
.label{ |
|
|
|
position: absolute; |
|
|
|
bottom: 0; |
|
|
|
left: 0; |
|
|
|
width: 100%; |
|
|
|
height: 98rpx; |
|
|
|
color: #FFFFFF; |
|
|
|
background: rgba(0, 0, 0, 0.5); |
|
|
|
display: flex; |
|
|
|
justify-content: center; |
|
|
|
padding: 0 20rpx; |
|
|
|
flex-wrap: nowrap; |
|
|
|
flex-direction: column; |
|
|
|
font-size: 28rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
