原来的样式:

在.wxml文件中控制台找到对应样式类:

在node_modules文件夹中找到sidebar-item,点击打开对应.wxss:


找到对应样式类,复制黏贴至插入了sidebar组件页面的.wxss文件:
复制内容:
黏贴后在类名前加:view (如图)
更改主题颜色

view .van-sidebar-item--selected{
border-color:var(--sidebar-selected-border-color,#d7aef3) ;
color:var(--sidebar-selected-text-color,#323233) ;
font-weight:var(--sidebar-selected-font-weight,550)
}
即可修改成功
效果图:

文章介绍了如何在微信小程序中修改sidebar-item组件的选中状态样式。通过在.wxml找到对应类名,然后在.wxss文件中复制样式到组件页面,并使用CSS变量来改变边框颜色、文字颜色和字体粗细,从而实现主题颜色的定制。
256

被折叠的 条评论
为什么被折叠?



