【已解决】uniapp使用vant-ui中的tab标签页的时候,发现底下红色的切换线不见了

问题截图

【已解决】uniapp使用vant-ui中的tab标签页的时候,发现底下红色的切换线不见了_第1张图片
【已解决】uniapp使用vant-ui中的tab标签页的时候,发现底下红色的切换线不见了_第2张图片

解决办法

按F12查看vant-ui源码你会发现他的Tab标签页里面有个width,但是我们引入到uniapp之后发现width没有了(不知道什么情况,可能是兼容问题吧)

【已解决】uniapp使用vant-ui中的tab标签页的时候,发现底下红色的切换线不见了_第3张图片

所以我们解决的办法,只需要在App.vue中给全局.van-tabs__line添加width宽度即可解决!

::v-deep .van-tabs__line{
	width: 40px !important;
}

【已解决】uniapp使用vant-ui中的tab标签页的时候,发现底下红色的切换线不见了_第4张图片

成功显示红线

【已解决】uniapp使用vant-ui中的tab标签页的时候,发现底下红色的切换线不见了_第5张图片

你可能感兴趣的:(uniapp学习笔记,报错问题解决,uni-app,ui)