douyin/src/pages/Test5.vue
2021-09-25 01:52:41 +08:00

224 lines
6.0 KiB
Vue

<template>
<div class="Test">
<SlideRowList
style="height: calc(100% - 5rem);"
v-model:active-index="activeIndex"
indicatorType="home"
>
<SlideItem>
<SlideColumnList>
<SlideItem style="background: tan">
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
</SlideItem>
<SlideItem style="background: red;">
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
</SlideItem>
<SlideItem style="background: yellow">
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
</SlideItem>
</SlideColumnList>
</SlideItem>
<SlideItem>
<SlideColumnList>
<SlideItem style="background: tan">
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
<p>111111111111</p>
</SlideItem>
<SlideItem style="background: red;">
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
<p>222222222222</p>
</SlideItem>
<SlideItem style="background: yellow">
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
<p>3333333333333</p>
</SlideItem>
</SlideColumnList>
</SlideItem>
</SlideRowList>
</div>
</template>
<script>
import BaseButton from "../components/BaseButton";
import BaseMarquee from "../components/BaseMarquee";
import Dom from "../utils/dom";
export default {
name: "Test4",
components: {BaseButton, BaseMarquee},
props: {
text: {
type: String,
default: '@喵嗷污说电影创作的原声'
}
},
data() {
return {
activeIndex: 0,
showIndicator: true,
}
},
methods: {
changeIndex() {
}
},
mounted() {
}
}
</script>
<style scoped lang="less">
@import "../assets/scss/index";
.Test {
position: fixed;
left: 0;
right: 0;
bottom: 0;
top: 0;
overflow: auto;
font-size: 1.4rem;
.content1 {
padding-top: 6rem;
}
}
</style>