6***@qq.com
6***@qq.com
  • 发布:2019-08-23 19:08
  • 更新:2020-11-10 14:28
  • 阅读:4821

【报Bug】switch组件改变状态不能改变颜色,不能设置color

分类:uni-app

详细问题描述

(DCloud产品不会有明显的bug,所以你遇到的问题大都是在特定环境下才能重现的问题,请仔细描述你的环境和重现方式,否则DCloud很难排查解决你的问题)

[内容]
使用switch组件改变选中状态,但是北京颜色没有改变,需要把.uni-switch-input:not([class*=""]) { background: #8799a3 !important;}注释掉才能,type是switch的时候还有×号在里面显示。

重现步骤

[步骤]

[结果]

[期望]

[如果语言难以表述清晰,拍一个视频或截图,有图有真相]

IDE运行环境说明

[HBuilder 或 HBuilderX。如果你用其他工具开发uni-app,也需要在此说明]

[IDE版本号]

[windows版本号]

[mac版本号]

uni-app运行环境说明

[运行端是h5或app或某个小程序?]

[运行端版本号]

[项目是cli创建的还是HBuilderX创建的?如果是cli创建的,请更新到最新版cli再试]

[编译模式是老模板模式还是新的自定义组件模式?]

App运行环境说明

[Android版本号]

[iOS版本号]

[手机型号]

[模拟器型号]

附件

[IDE问题请提供HBuilderX运行日志。菜单帮助-查看运行日志,点右键打开文件所在目录,将log文件压缩成zip包上传]

[App问题请提供可重现问题的代码片段,你补充的细一点,问题就解决的快一点]

[App安装包或H5地址]

[可重现代码片段]

联系方式

[QQ]

2019-08-23 19:08 负责人:无 分享
已邀请:
爱折腾的章鱼猫

爱折腾的章鱼猫

如果用的是colorUI
1.先把colorUI覆盖的背景样式注释掉;

复制代码/* switch .wx-switch-input:not([class*=""]),  
switch .uni-switch-input:not([class*=""]) {  
    background: #8799a3 !important;  
} */

2.再把switch中×的样式只编译到微信平台

复制代码 /* #ifdef MP-WEIXIN */  
switch::before {  
    content: "\e646";  
    right: 0;  
    transform: scale(1, 1);  
    left: auto;  
}  
/* #endif */
DCloud_uni-ad_HDX

DCloud_uni-ad_HDX

是否设置了 color 属性

复制代码<switch checked color="#FFCC33" />

参考文档
https://uniapp.dcloud.io/component/switch?id=switch

  • 6***@qq.com (作者)

    额,抱歉。看了hello-uniapp,发现是之前引用了插件市场的一个UI,css被覆盖了.....

    2019-09-06 15:57

  • 一个好名字

    回复 6***@qq.com: 老哥能分享一下怎么解决的吗?谢谢

    2020-10-19 16:43

该问题目前已经被锁定, 无法添加新回复

  • 标题 / 粗斜体
  • 代码片段
  • 超链接 / 图片 / 视频
  • 列表 / 引用

文章内容较多时,可以用标题分段 :

## 大标题 
### 小标题

斜体 / 粗体 :

**粗体** 
*斜体*
***粗斜体***

代码片段 :

``` javascript
代码片段
```

超链接 :

[链接文字](链接地址) 例: [百度](http://www.baidu.com)

图片 :

![图片说明](图片地址) 例: ![百度logo](http://www.baidu.com/img/bdlogo.gif)

视频 :

!![视频说明](视频地址) 例: !![优酷视频](http://youku.com)

有序列表 :

1. 123
2. 123
3. 123

无序列表 :

- 123
- 123
- 123

引用 : ( 双回车后结束引用 )

> 引用内容
引用内容
引用内容