如果不想使用swiper，則可以使用原生CSS的方式

<template><div class="test-scroller"><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div><div>33333333</div><div>4444444444</div><div>66666666666</div><div>65666666666</div></div> </template><script> export default {name: 'TSP',data() {return {msg: 'Welcome to Your Vue.js App'}} } </script><style lang="less" scoped> .test-scroller {-webkit-overflow-scrolling: touch;overflow-scrolling: touch;background: red;color: #fff;height: 30rem;overflow: scroll; } </style>

總結

以上是生活随笔為你收集整理的vue局部滚动组件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。