theluyuan/deming
2
1
Fork 0
Code Issues Pull Requests Releases Wiki Activity

达人详情完成

Browse Source
This commit is contained in:
luyuan
2020-06-03 10:53:38 +08:00
parent 0f3073e577
commit b5ef323612
3 changed files with 195 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
pageB/details/index.vue Normal file
View File

@@ -0,0 +1,100 @@
<template>
<view class="details">
<view style="border-top: 1rpx solid #ececec;"></view>
<userinfo></userinfo>
<view style="border-top: 20rpx solid #ececec;"></view>
<u-tabs :is-scroll="false" bar-width="70" ref="tabs" :list="list" :current="num" :bar-style="{
'background-color':'#FF780F',
'bottom':'10rpx'
}"
inactive-color="#333"
:active-item-style="{
'color':'#FF780F'
}"
:bold="false"
@change="dianji"
:show-bar="false"></u-tabs>
<swiper class="card" @change="dianji" :current="num">
<swiper-item>
<scroll-view style="width:100%;height:100%" scroll-y="true">
<view class="box">
<view class="list">
<view >
<videoItem v-for="item in 10"></videoItem>
</view>
<view style="margin-left:20rpx">
<videoItem v-for="item in 10"></videoItem>
</view>
</view>
</view>
</scroll-view>
</swiper-item>
<swiper-item>
<scroll-view style="width:100%;height:100%" scroll-y="true">
<view class="box">
<view class="list">
<view >
<zhiboItem v-for="item in 10"></zhiboItem>
</view>
<view style="margin-left:20rpx">
<zhiboItem v-for="item in 10"></zhiboItem>
</view>
</view>
</view>
</scroll-view>
</swiper-item>
</swiper>
</view>
</template>
<style lang="scss" scoped>
.details{
.card{
height: 100vh;
width: 100%;
.box{
width: 100%;
padding: 0 30rpx;
}
.list{
display: flex;
}
}
}
</style>
<script>
import videoItem from "@/components/index/video-item/index"
import zhiboItem from "@/components/index/zhibo-item/index"
import userinfo from "../components/details/userinfo"
export default {
name:"details",
components:{
userinfo,
videoItem,
zhiboItem
},
data(){
return {
list:[
{
name: '短视频'
}, {
name: '图文'
}
],
num:0
}
},
methods:{
dianji(a){
console.log(a)
if(typeof a == "object"){
this.num = a.detail.current
}else{
this.num = a
}
}
}
}
</script>