vue使用vant组件时无法修改默认样式问题

由于vue开发时会在style加上scoped避免全局污染，所以正常开发时直接修改外部组件（vant）的样式时会不生效，我们把scoped删除后会发现样式是可以生效的。但是scoped是肯定不能不要的。所以我们可以用 /deep/（深度监听）来修改样式/deep/.van-dropdown-menu__title{font-size: 0.26rem;...

_Hoodie

5488人浏览 · 2020-04-20 11:24:45

_Hoodie · 2020-04-20 11:24:45 发布

由于vue开发时会在style加上scoped避免全局污染，所以正常开发时直接修改外部组件（vant）的样式时会不生效，我们把scoped删除后会发现样式是可以生效的。但是scoped是肯定不能不要的。所以我们可以用 /deep/（深度）来修改样式


/deep/.van-dropdown-menu__title{
	font-size: 0.26rem;
	font-family: Source Han Sans CN Regular;
	font-weight: 400;
	text-align: left;
	color: #333333;
}

/deep/

如图所示，在标签前加上 /deep/ 就可以了

vue 官方给出的解释 官方解释

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^