1、安装插件
使用 npm安装 npm i vueloopscroll
2、在 main.js中引入
import VueLoopScroll from 'vueloopscroll'
import 'vueloopscroll/lib/vueloopscroll.css';
Vue.use(VueLoopScroll)
源码:
export default {
data() {
return {
list: [{
title: '11111111111111111',
}, {
title: '22222222222222222',
},{
title: '33333333333333333',
},{
title: '44444444444444444',
},{
title: '55555555555555555',
},{
title: '66666666666666666',
}, {
title: '77777777777777777',
},{
title: '88888888888888888',
},{
title: '99999999999999999',
},{
title: '1010101010101010',
},{
title: '11111111111111111',
}, {
title: '12121212121121211',
},{
title: '13131313133131331',
},{
title: '1414141414141414',
},{
title: '1515151151515151',
},{
title: '1616161611616161',
}, {
title: '1717171717171717',
},{
title: '18181818181818811',
},{
title: '1919191991191919',
},{
title: '2020202020202202',
}]
}
}
}
.scrolltop{
background:#f4f4f4;
height: 30px;
line-height: 30px;
}
.scrolltop /deep/ .vue-loop-scroll {
height: 30px;
}
.s1 li{
height: 30px;
line-height:30px;
font-size: 12px;
}