78 lines
1.4 KiB
Vue
78 lines
1.4 KiB
Vue
<template>
|
|
<view class="explosiveList_content">
|
|
<view class="_explosive_title">书友推荐</view>
|
|
<view class="_explosive_list">
|
|
<view class="_explosive_list_item" v-for="m in dataList" :key="m.id" @tap="toBooksReadingDetail(m)">
|
|
<view class="_explosive_list_item_box">
|
|
<CommBookItem :bookName="m.title" :bookTips="m.category_name" :bookImage="m.cover" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import CommBookItem from '@/components/commBookItem/index.vue'
|
|
export default {
|
|
components: {
|
|
CommBookItem
|
|
},
|
|
props: {
|
|
dataList: {
|
|
type: Array,
|
|
default: []
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
|
|
}
|
|
},
|
|
methods:{
|
|
toBooksReadingDetail(row) {
|
|
uni.navigateTo({
|
|
url: `/pages/booksReadingDetail/booksReadingDetail?sid=${row.id}&t=${row.title}`
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.explosiveList_content {
|
|
width: 100%;
|
|
|
|
._explosive_title {
|
|
font-size: 36rpx;
|
|
color: #1A1A1A;
|
|
line-height: 1;
|
|
font-weight: 600;
|
|
}
|
|
|
|
._explosive_list {
|
|
width: 100%;
|
|
display: flex;
|
|
// justify-content: safe center;
|
|
flex-wrap: wrap;
|
|
|
|
._explosive_list_item {
|
|
width: 200rpx;
|
|
padding-top: 32rpx;
|
|
margin-left: 32rpx;
|
|
|
|
._explosive_list_item_box {
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
._explosive_list_item:first-child {
|
|
margin-left: 0;
|
|
}
|
|
|
|
._explosive_list_item:nth-child(4n + 0) {
|
|
margin-left: 0;
|
|
}
|
|
|
|
}
|
|
}
|
|
</style> |