当前位置: 首页 > news >正文

[uniapp/wx小程序] 给自定义组件或ui组件加样式在wx小程序不生效

原因:

不论是自定义组件还是ui组件,本质上都是因为微信小程序的组件隔离策略造成的

另外,组件内不能使用id选择器

官方说明:

组件和引用组件的页面不能使用id选择器(#a)、属性选择器([a])和标签名选择器,请改用class选择器。

#a { } /* 在组件中不能使用 */
[a] { } /* 在组件中不能使用 */
button { } /* 在组件中不能使用 */
.a > .b { } /* 除非 .a 是 view 组件节点,否则不一定会生效 */

几种解决方法参考:

1.首先检查选择器的问题,组件内不能使用id选择器
2.解除样式隔离

和data/methods同级,增加该配置,这样父级的样式就可以穿透到子组件

options: {styleIsolation: 'shared', // 解除样式隔离
}
3.使用 ::v-deep
::v-deep .xxx{width:100px;
}

相关文章:

  • 搭建智能客服机器人:langgraph实现用户订单管理
  • 尝试给OpenHarmony4.0增加可以在动态库中使用的日志模块
  • 图像处理 -- ISP 之 tone mapping功能的实现原理
  • systemback制作Ubuntu自己的系统镜像
  • 观察者模式解析:实现对象间的舞蹈同步!
  • 怎么生成一个springboot的项目
  • Python中的random模块及相关模块详解
  • Application实际在云原生中的应用
  • 在ubuntu16.04下使用词典工具GoldenDict
  • thrift:拦截器ThriftEventHandler获取调用参数
  • SpringBoot项目启动后自动执行方法
  • 广州自闭症全托管学校-正规儿童康复中心
  • 利用深度学习技术来实现街景图像的语义分割(街景图像语义分割)
  • 基于WonderJourney生成电影级连续的3D场景视频
  • Java学习Day33:HTML 第四章:大战虎先锋(js)
  • 《剑指offer》分解让复杂问题更简单
  • 2017届校招提前批面试回顾
  • Java 内存分配及垃圾回收机制初探
  • Javascript Math对象和Date对象常用方法详解
  • JavaScript设计模式之工厂模式
  • Linux编程学习笔记 | Linux多线程学习[2] - 线程的同步
  • nfs客户端进程变D,延伸linux的lock
  • PHP面试之三:MySQL数据库
  • React Native移动开发实战-3-实现页面间的数据传递
  • Vue.js 移动端适配之 vw 解决方案
  • vue--为什么data属性必须是一个函数
  • 订阅Forge Viewer所有的事件
  • 前端面试总结(at, md)
  • 一份游戏开发学习路线
  • Oracle Portal 11g Diagnostics using Remote Diagnostic Agent (RDA) [ID 1059805.
  • 仓管云——企业云erp功能有哪些?
  • ​创新驱动,边缘计算领袖:亚马逊云科技海外服务器服务再进化
  • ## 临床数据 两两比较 加显著性boxplot加显著性
  • #我与Java虚拟机的故事#连载11: JVM学习之路
  • $.ajax()方法详解
  • (14)目标检测_SSD训练代码基于pytorch搭建代码
  • (3)医疗图像处理:MRI磁共振成像-快速采集--(杨正汉)
  • (52)只出现一次的数字III
  • (6)【Python/机器学习/深度学习】Machine-Learning模型与算法应用—使用Adaboost建模及工作环境下的数据分析整理
  • (第61天)多租户架构(CDB/PDB)
  • (二)Eureka服务搭建,服务注册,服务发现
  • (二)Pytorch快速搭建神经网络模型实现气温预测回归(代码+详细注解)
  • (附源码)springboot学生选课系统 毕业设计 612555
  • (免费领源码)Java#Springboot#mysql农产品销售管理系统47627-计算机毕业设计项目选题推荐
  • (牛客腾讯思维编程题)编码编码分组打印下标(java 版本+ C版本)
  • (三分钟了解debug)SLAM研究方向-Debug总结
  • (十二)springboot实战——SSE服务推送事件案例实现
  • (五)MySQL的备份及恢复
  • (小白学Java)Java简介和基本配置
  • (一)认识微服务
  • **CI中自动类加载的用法总结
  • .Net core 6.0 升8.0
  • .Net Core 微服务之Consul(二)-集群搭建
  • .NET Core中如何集成RabbitMQ
  • .Net Memory Profiler的使用举例