网站设计分析_离婚证app制作软件_微信视频号可以推广吗_爱站网关键词查询

安装包

npm install vue3-seamless-scroll --save

全局注册

在main.js中进行全局注册

  // **main.js**import { createApp } from 'vue';import App from './App.vue';import vue3SeamlessScroll from "vue3-seamless-scroll";const app = createApp(App);app.use(vue3SeamlessScroll);app.mount('#app');

使用组件

数据准备：list是一个对象数组，

const tableData = [{date: "2016-05-02",name: "Tom",address: "No. 189, Grove St, Los Angeles",},{date: "2016-05-03",name: "Tom",address: "No. 189, Grove St, Los Angeles",},{date: "2016-05-07",name: "Tom",address: "No. 189, Grove St, Los Angeles",},{date: "2016-05-08",name: "Tom",address: "No. 189, Grove St, Los Angeles",}.....
];

html

<vue3-seamless-scroll :list="list" class="scroll"><div class="item" v-for="(item, index) in list" :key="index"><span>{{item.title}}</span><span>{{item.date}}</span></div></vue3-seamless-scroll>

css

必须设置height和overflow: hidden;

.scroll {height: 270px;width: 500px;margin: 100px auto;overflow: hidden;
}