1,使用吸顶页面
<template>
<div>
<ul>
<li v-for="(item, index) in headerData" :key="index">{
{
item }}</li>
</ul>
<!--
这里需要给组件添加一个class,用于控制固定的位置,看css注释部分
-->
<sticky-slot class="stickyTop">
<div class="tab">
假装这是一个tab栏,当页面滚动的时候要固定在顶部
</div>
</sticky-slot>
<ul>
<li v-for="(item, index) in footerData" :key="index">{
{
item }}</li>
</ul>
</div>
</template>
<script>
import stickySlot from '@/common/stickySlot.vue' // 需改为对应的组件存放的路径
export default {
components: {
stickySlot
},
data() {
return {
headerData: [],
footerData: []
};
},
created