你家表哥
你家表哥
  • 发布:2019-05-31 13:21
  • 更新:2020-07-07 16:48
  • 阅读:9902

uni-app如何修改其他组件的 样式呢?

分类:uni-app

我在使用 官方的uni-grid 组件,但是我发现它的字体过大,我想修改它,

原组件的样式 :
.uni-grid-item-text {
font-size: 32upx;
color: #333;
margin-top: 12upx
}

我功能页面A.vue

.uni-grid-item-text {
font-size: 20upx;
}

怎么修改都无效,我尝试过用 >>> 深度筛选,但是一样无效(小程序端)

各位大佬是如何处理这个问题的呢?》

2019-05-31 13:21 负责人:无 分享
已邀请:
krystalzgs@163.com

krystalzgs@163.com

app里面不生效

the_wolf_life

the_wolf_life - 大前端领航者

可以新添类名 样式使用权重 !important

aliang888

aliang888

在app.vue里定义的样式是全局的,其它页面定义的样式是局部的,父页面定义的样式不能覆盖子组件页里面的样子,求助

父页面的所有样式名称后面会被自动加上类似这样子的东西.a[data-v-123456]
子组件的所有样式名称后面会被自动加上类似这样子的东西.a[data-v-334455]

就是因为 a[data-v-123456] <> a[data-v-334455] 所以样式无法覆盖重定,那这样子使用灵活性太差了,有啥破解方法

aliang888

aliang888

问题已自己解决,问官方QQ群也没有一个人回答,论坛也没有人回答

  • silence_more

    大兄弟,怎么解决的,我用/deep/不管怎样都只能改到H5上的,小程序一直没卵用,困扰好久了

    2020-08-13 15:17

一二姗

一二姗

请问一下是怎么解决的呢,我也遇到这个问题了

  • aliang888

    搜索 vue scoped 深度作用选择器,你就能找到解决办法了 :)

    2019-07-12 14:06

  • 511202838@qq.com

    回复 aliang888: 你好,我页遇到了这个问题,使用 vue scoped 深度作用选择器,后边这个[data-v-xxxxxx] 还是不一样,覆盖不了,麻烦问下怎么处理呢?

    2019-07-20 16:36

  • jamnsin@live.cn

    回复 511202838@qq.com:

    这样就可以解决了。

    <style lang="scss" scoped>

    /deep/ .segmented-control {

    width: 100%;

    }

    2019-09-19 15:42

  • 734665222@qq.com

    回复 aliang888: 请问你这个在app端也生效吗?

    2019-12-25 15:10

  • simin183@126.com

    回复 jamnsin@live.cn: 我这边还是不生效呢

    2020-05-22 15:22

HenryLiu

HenryLiu

深度选择器在app里不生效有人解决了没?

Vidvan

Vidvan - 前端工程师

在App.vue下引入uni-custom.less样式文件,把需要修改组件样式都放到这里面就可以了

要回复问题请先登录注册