1、安装依赖:
cnpm i vue3-seamless-scroll
2、新建一个.vue文件,在template中添加如下代码:
<vue3-seamless-scroll
:list="warningList"
class="seamless-warp"
:step="0.2"
:hover="true"
>
<ul class="warning_list">
<li v-for="(item, index) in warningList" :key="index">
<el-row>
<el-col :span="10" class="reason"> {{ item.reason }}</el-col>
<el-col :span="10">{{ item.address }}</el-col>
<el-col :span="4">{{ item.time }}</el-col>
</el-row>
</li>
</ul>
</vue3-seamless-scroll>
3、js中引入:import { Vue3SeamlessScroll } from 'vue3-seamless-scroll';
4、给vue3-seamless-scroll添加如下样式:
.seamless-warp {
height: 300px;
width: 800px;
overflow: hidden;
}