uniapp 放大中间图标

方法1:使用css

复制代码
/*样式直接复制到项目的App.vue即可*/

.uni-tabbar {
/*.uni-tabbar__item:nth-last-child(3) 修改倒数第三个 也就是中间的图标 我这边底部栏是五个*/
		.uni-tabbar__item:nth-last-child(3) {
			.uni-tabbar__bd {
			/*.uni-tabbar__icon 去掉原图标大小,强制为自适应宽高*/
				.uni-tabbar__icon {
					width: auto !important;
					height: auto !important;
				}
				/*图标大小 !important 强制覆盖*/
				img {
					height: 70rpx !important;
					width: 70rpx !important;
				}
			}
		}
	}

方法2:配置midButton(和tabbar中list同级)

复制代码
"midButton": {
            "width": "48px",
            "height": "48px",
            "text": "",
            "iconPath": "static/tabbar/home-s.png",
            "iconWidth": "48px",
        }

 API放在一个app.vue的页面内就好了。url里填写你要跳转的路径。

uni.onTabBarMidButtonTap(()=>{

                       uni.navigateTo({

                        url: '/pages/card/card'

                       });

                    })

官网资料:uni-app官网

相关推荐
徐小夕14 小时前
我们开源了一款“框架无关”的思维导图编辑器,3分钟集成到任意系统
前端·javascript·github
时光足迹14 小时前
uni-app 视频通话实战:康复师与患者视频问诊的 6 个致命 Bug 与解决方案
android·ios·uni-app
PBitW14 小时前
GPT训练我的第三天,明白了应该咋说满分回答!😕😕😕
前端·javascript·面试
像我这样帅的人丶你还14 小时前
Java 后端详解(四):分页与搜索
java·javascript·后端
摸着石头过河的石头14 小时前
前端多仓库管理:从混乱到有序的进化之路
前端
星栈14 小时前
写 Dioxus Demo 不难,难的是把它写成项目
前端·rust·前端框架
labixiong14 小时前
还原一个完整符合规范的 Promise(二)
前端·javascript
时光足迹15 小时前
腾讯云 TRTC UniApp SDK 从入门到上线
前端·vue.js·uni-app
时光足迹15 小时前
uni-app 里把加密视频嵌入页面播放?我分析了 4 种方案,只有 1 种接近完美
前端·vue.js·uni-app
时光足迹15 小时前
JPush UniApp UTS 插件完全参考手册:API、事件与厂商通道一网打尽
vue.js·ios·uni-app