在vue实际项目开发中，我们避免不了使用一些开源的UI组件库，style的样式中都会增加 scoped 标识只会在当前页面中去使用，这就涉及到了如何修改默认组件样式的问题了。
1.在使用scss的情况下，要使用::v-deep，/deep/是不支持的，会报错。
<style lang="scss" scoped>
::v-deep .van-button {
background: red;
}
/* 会报错
/deep/ .van-button {
background: red;
}
*/
</style>
2.在使用less的情况下，使用::v-deep或/deep/，改变默认样式。
<style lang="less" scoped>
::v-deep .van-button {
background: red;
}
/deep/ .van-button {
background: red;
}
</style>
3.css样式处理的时候，使用 >>>
<style scoped>
.class >>> .loading-warp {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
</style>
这样就基本大功告成了，快去试试体验体验吧，哈哈哈哈哈哈哈哈哈。文章来源地址https://www.toymoban.com/news/detail-535206.html
文章来源：https://www.toymoban.com/news/detail-535206.html
到了这里，关于使用scss/less修改vant UI样式的方法的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
