facchin
facchin
  • 发布:2019-08-30 09:03
  • 更新:2021-09-04 10:43
  • 阅读:17656

uniapp picker确定文字如何修改颜色

分类:uni-app


在社区搜索到的答案只能在H5下生效,app端无法生效

uni-picker .uni-picker-action.uni-picker-action-confirm{  
        color: #57DBD0 !important;  
}

2019/12/11更新:
新版本uniapp 以上方法无效哦,建议大家还是自定义实现picker吧(虽然还是可以改源码)

2019-08-30 09:03 负责人:无 分享
已邀请:
5***@qq.com

5***@qq.com - 90后IT男

最新版改HBuilderX\plugins\uniapp-cli\node_modules\@dcloudio\uni-h5\dist\index.css文件里的样式就可以了

风雨天涯

风雨天涯

简单的弄个属性confirmTextColor=?出来就可以。。然而这个确定字体颜色不能换灰黑色也好啊这样等于picker就没法用了。用picker一两行代码,picker-view十几行代码呢!说那么多我还是得自己写个select。。。

facchin

facchin (作者)

救救孩子吧~

1***@qq.com

1***@qq.com

解决了嘛

  • facchin (作者)

    解决了 我直接在uniapp里面改的源码

    2019-09-24 14:44

  • 1***@qq.com

    回复 facchin: 麻烦问下在哪里改的啊orz

    2019-10-02 15:01

  • facchin (作者)

    回复 1***@qq.com: HBuilderX/plugins/weapp-tools/template/common/__uniapppicker.html 下的uni-picker-action-confirm

    2019-10-08 11:14

  • 即时通讯开发

    回复 facchin: C:\Users\Administrator\Desktop\资料\HBuilderX.2.2.2.20190816.full\HBuilderX\plugins\uniapp-cli\node_modules\@dcloudio\uni-h5\src\platforms\h5\view\components\picker位置不应该在这里吗

    2020-03-30 11:21

  • 贤哥是zhu

    回复 即时通讯开发: 请问修改了样式为啥不生效啊???

    2020-04-21 16:11

  • b***@163.com

    回复 facchin: 我项目里怎么没有HbuilderX目录,崩溃了

    2023-05-25 16:30

facchin

facchin (作者)

自己回答下~

HBuilderX/plugins/weapp-tools/template/common/__uniapppicker.html 下的uni-picker-action-confirm

如果有更好的方法,请大佬告知下,感谢!

1***@qq.com

1***@qq.com

我这也无效呀

  • facchin (作者)

    我直接改的源码 在app端 源码里面样式有作用域,外面修改不到,我只能在HBuilderX/plugins/weapp-tools/template/common/__uniapppicker.html 下的uni-picker-action-confirm修改了 勉强对付把

    2019-11-15 15:36

DCloud_heavensoft

DCloud_heavensoft

为什么要修改呢?给个修改的场景。
原生ui里很多样式都是系统样式,除了picker还有弹出确认框等很多地方,都有修改需求吗?
另外,可以自己用picker-view来实现一个picker,这样按钮可以自己控制

  • facchin (作者)

    我在写项目的时候 nvue还不支持picker-view

    2019-11-15 16:06

  • 1***@qq.com

    现在发现 项目中 那个取消同它的背景色一样 导致取消 看不到 你看下我的截图

    2019-11-15 17:42

  • 阿Zone

    修改场景:因为技术能力有限,但又希望整体UI更和谐,比如配色、字号、行间距等细节方面,这个做UI的人或对设计有要求的产品,会有体会。

    另外建议uniapp团队应该招一个优秀的UI设计,可以对uniapp做到一个美观度以及用户体验上很好的把控,因为目前uniapp很多设计的美观度上还是有些欠缺

    2021-07-22 11:34

  • 愿随风丶飘雪

    修改的场景可太多了 本来app主题是绿色的,突然弹出个picker是蓝色的,还是很变扭的

    2023-07-10 13:56

1***@qq.com

1***@qq.com

这个问题 这是没动它的时候

  • facchin (作者)

    新版本 picker组件换了实现的方式 所以以上方法无效

    2019-12-11 16:51

  • 5***@qq.com

    回复 facchin: 有新版本的替换方案吗

    2020-05-13 17:00

1***@qq.com

1***@qq.com

小程序端picker组件怎么把确定和取消改成英文的呀,救救我吧

  • 1***@qq.com

    无法设置就自己写一个

    区分是否被选中 使用背景色吧

    2019-12-12 11:31

  • 端小萌

    请教一下,后来怎么改的呀QAQ

    2021-12-09 10:51

尹成诺

尹成诺 - 辣鸡前端

改源码 666 学到了

pimd

pimd - 前端

如何修改确定的颜色

easyswb

easyswb - 前端菜鸟学习中

改了H5生效,微信小程序不生效.

  • DCloud_heavensoft

    因为微信的picker,是原生实现的,不受你的前端代码影响。如果要在微信里改颜色,只能自己用picker-view模拟一个picker。插件市场有mpvue-piker等很多插件都是类似的做法

    2020-03-17 21:06

贤哥是zhu

贤哥是zhu

app端到底改哪个文件啊,求助各位大佬,几个地方都改了就是不生效

5***@qq.com

5***@qq.com - 90后IT男

app源码那位大佬知道在哪里改

4***@qq.com

4***@qq.com

我的方式是
/deep/.uni-picker-view-indicator{
height: 7vh !important;
}

d***@163.com

d***@163.com

修改源码解决

无效
HBuilderX/plugins/weapp-tools/template/common/__uniapppicker.html 下的uni-picker-action-confirm

无效
HBuilderX\plugins\uniapp-cli\node_modules\@dcloudio\uni-h5\dist\index.css

  • d***@163.com

    亲测可解决 无须改源码

    app.vue


    .uni-picker-container .uni-picker .uni-picker-action-confirm{color: #d7b57c!important;}

    2020-11-10 12:32

  • 5***@qq.com

    回复 d***@163.com: app这么写无效,h5可以,app参考修改D:\HBuilderX\plugins\uniapp-cli\node_modules\@dcloudio\uni-app-plus\template\common__uniapppicker.js 通过app运行可以直接看到效果

    2020-11-17 09:46

  • 1***@qq.com

    回复 d***@163.com: 牛逼

    2020-11-20 11:19

  • 女儿国宰相

    回复 d***@163.com: 感谢大佬

    2021-01-12 13:48

  • smoot

    回复 d***@163.com: 您好,我这边是uniapp项目,加了不生效呢

    2022-02-17 11:56

s***@163.com

s***@163.com

官方大哥动动手指头的事情,搞的这么麻烦

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