前端Vue uView 组件<u-search> 自定义右侧搜索按钮样式

前言

uView 文档的效果不是ui设计的样式 需要重新编辑

  • 原效果

ui设计效果

解决方案

设置里说明的需要传一个样式对象

这个对象 需要写在 script 标签里面

这里需要遵循驼峰命名 比如font-size 改为 fontSize

lineHeight和textAlign为水平锤子居中效果

css 复制代码
searchStyle: {
			background: '#F62F33',
			width: '105rpx',
			height: '60rpx',
			borderRadius: '30rpx',
			fontSize: '28rpx',
			color: '#FFFFFF',
			lineHeight:'60rpx',
			textAlign:'center'
			}

实现效果

差不多是这样的效果

相关推荐
PBitW13 小时前
GPT训练我的第二天,我表示不过如此!!!😕😕😕
前端·javascript·面试
用户990450177800914 小时前
学习了AI修图,我把自己闲鱼出租房照片整成airbnb风格了
前端
kyriewen14 小时前
白宫直接给 OpenAI 下了限制令,GPT-5.6 不能随便放出来了
前端·javascript·面试
PedroQue9915 小时前
Vite插件v0.2.6:架构优化与自动化升级
前端·vite
threerocks17 小时前
什么?我连 A2A、MCP 都没学会,现在又来了 AG-UI、A2UI.
前端·aigc·ai编程
牛奶17 小时前
如何自己写一个浏览器插件?
前端·chrome·浏览器
亿元程序员18 小时前
为什么Cocos都4.0了还有人用2.x?
前端
MomentYY18 小时前
AI 到底是“懂”,还是在“猜”?
前端·人工智能·ai编程
鹏毓网络科技18 小时前
Cursor Rules 文件配置实战:3 个隐藏参数让我每月少写 40% 样板代码
前端·github
没烦恼30118 小时前
无痕模式下 HTTP\-First 拦截引发的“页面刷新”误判
前端