Ant Design Vue - 去掉 ＜a-tabs＞ 标签页组件底部细条灰色线（清掉选项卡组件整体底部灰色黑色细线）

前言

默认情况下，<a-tabs> 组件底部有一条 “贯穿式” 灰色细线，如下图所示：

解决方案

通过 tabBarStyle 属性，可以轻松去掉，网上大部分文章都采用了直接覆盖样式的方式，这样是不规范的。

在组件上绑定属性，其 borderBottom 属性设置为 unset 即可。

<a-tabs :tabBarStyle="{ borderBottom: 'unset' }">
    ...
</a-tabs>
1
2
3

成功去除：

写在后面

改变其他样式同样可行，比如字体大小。