vue 去除系统默认的滚动条

在 Vue.js 中，如果你想去除网页的默认滚动条，可以利用 CSS 的 `overflow` 属性来隐藏它。通常我们会针对整个应用或者特定的容器来设置。这里有一个示例：

<div class="no-scrollbar" ref="myScrollableElement">
  <!-- 你的内容 -->
</div>

<style scoped>
.no-scrollbar {
  overflow-y: hidden; /* 隐藏垂直滚动条 */
  scrollbar-width: none; /* 移除浏览器自带滚动条 */
}

/* 如果需要禁用滚动区域的手动滚动，可以添加下面这行 */
.no-scrollbar::-webkit-scrollbar { /* 对于 Webkit 浏览器（如 Chrome 和 Safari） */
  display: none;
}
</style>

在上述代码中，`.no-scrollbar` 类设置了 `overflow-y: hidden` 来阻止垂直方向的滚动，同时使用 `-webkit-scrollbar` 规则来移除滚动条。`scrollbar-width: none;` 是为了确保滚动条在某些浏览器（如 Firefox）中正常工作。

需要注意的是，这种方法并不影响通过 JavaScript 动态滚动，只是让默认的滚动条不可见。如果你确实不需要滚动功能，还可以考虑使用第三方库如 `vue-pure-scrollbar` 来替换滚动条样式。