pan-mini/pages/category/category.vue

113 lines
2.5 KiB
Vue

<template>
<smart-tabs
:tabs="tabs"
:initial-index="current"
:scrollEnable="true"
:activeColor="'#19c324'"
@change="handleTabChange"
>
</smart-tabs>
<!-- 视频列表 -->
<view class="video-container">
<image-grid-simple
:imageList="list"
:columns="2"
:height="'80vh'"
@image-click="handlerClick"
>
<template #empty>
<view class="custom-empty">
<image src="/static/images/no-videos.png" />
<text>没有找到视频内容</text>
</view>
</template>
</image-grid-simple>
</view>
</template>
<script>
export default {
data() {
return {
current:0,
tabs:[],
list:[
{
"id":1,
"title":"1",
"src":"../../static/images/default.png"
},
{
"id":2,
"title":2,
"src":"../../static/images/default.png"
},
{
"id":3,
"title":3,
"src":"../../static/images/default.png"
},
{
"id":9,
"title":9,
"src":"../../static/images/default.png"
},
{
"id":4,
"title":4,
"src":"../../static/images/default.png"
},
{
"id":5,
"title":5,
"src":"../../static/images/default.png"
},
{
"id":6,
"title":6,
"src":"../../static/images/default.png"
},
{
"id":7,
"title":7,
"src":"../../static/images/default.png"
},
{
"id":8,
"title":8,
"src":"../../static/images/default.png"
}
]
}
},
onLoad() {
this.getCategory()
},
methods: {
getCategory() {
// 获取分类
this.tabs = [
{label:"拉布布",value:"labubu"},
{label:"科幻",value:"kh"},
{label:"酷炫汽车1",value:"car1"},
{label:"酷炫汽车2",value:"car2"},
{label:"酷炫汽车3",value:"car3"},
{label:"酷炫汽车4",value:"car4"},
{label:"酷炫汽车5",value:"car5"},
{label:"雏田",value:"ct"}
]
},
handleTabChange(idx) {
this.current = idx;
console.log(this.tabs[idx])
}
}
}
</script>
<style>
</style>