ant-design-vue没找到滚动条设置,有什么替代方案吗?

编写了一个左侧菜单,展开后过长和右侧内容区域不协调,没找到滚动条相关的设置。请问大家有什么好方案吗?

Ant Design Vue 是一款基于 Vue 的 UI 组件库,没有提供滚动条组件,但是你可以使用第三方库或者直接使用 CSS 来实现滚动条的设置。

一个常用的第三方库是 "vue-perfect-scrollbar",它提供了一个高度可定制的滚动条组件,并且兼容 Ant Design Vue。

如果你想使用 CSS 来实现,可以参考以下代码:

.scrollbar {
  overflow: auto;
  height: 200px;
  width: 100%;
}

.scrollbar::-webkit-scrollbar {
  width: 8px;
}

.scrollbar::-webkit-scrollbar-thumb {
  background-color: #ccc;
  border-radius: 10px;
}

.scrollbar::-webkit-scrollbar-track {
  background-color: #f1f1f1;
  border-radius: 10px;
}


不知道你这个问题是否已经解决, 如果还没有解决的话:
  • 请看👉 :ant-design-vue组件按需引入及报错解决
  • 除此之外, 这篇博客: 运用ant-design-vue组件库,且在项目中遇到的一些问题中的 当你遇到这样的bug时,可能出现了这样的问题 部分也许能够解决你的问题, 你可以仔细阅读以下内容或者直接跳转源博客中阅读:

    vue.runtime.esm.js?0261:619 [Vue warn]: Error in render: “TypeError:
    Cannot read property ‘0’ of undefined”

    出现这个错误的原因其实是Vue在拿到数据之前就渲染了dom,那么在你的html结构中加上v-if,某个数据的长度,如:

    v-if="dataList.length>0
    

    “ReferenceError: h is not defined”

    原因:在用到colums,没放到data里定义,会报错

    本次就写这么多,下次继续更新,写的不好还望多多指教,谢谢!


如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^