uni-app 从零开始第三章:底部 tabBar

news2024/9/30 1:33:57

pages.json 页面路由 | uni-app官网


一、新建 home页面 

 

  

找到pages目录,新增一个home的页面,勾选上同时新建文件夹 

新建完成后,pages.json 中 会自动添加上刚刚新建的文件信息


二、新增tabBar数据

在 pages.json中新增以下代码

	"tabBar": {
		"color": "#7A7E83",
		"selectedColor": "#007AFF",
		"borderStyle": "black",
		"backgroundColor": "#F8F8F8",
		"list": [{
				"pagePath": "pages/index/index",
				// "iconPath": "static/component.png",
				// "selectedIconPath": "static/componentHL.png",
				"text": "主页"
			},
			{
				"pagePath": "pages/home/home",
				// "iconPath": "static/api.png",
				// "selectedIconPath": "static/apiHL.png",
				"text": "首页"
			}
		]
	}


三、保存运行

保存运行后,重新编译小程序会发现成功添加了 底部菜单 tabBar 

具体要修改相关样式颜色,可以参考官方文档

pages.json 页面路由 | uni-app官网

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/737267.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

基于pyqt5实现一款简单的界面软件(radioButton、comboBox、pushButton、图片显示)

pyqt5使用记录涉及pyqt界面控件的基本介绍,使用designer设计界面ui,并将其转化为py代码。关于界面主要实现radioButton的互斥选中事件、comboBox的选中事件(依据list添加item)、pushButton的单击事件、槽函数自动绑定、图片的拖入…

嵌入式开发之上位机工业风界面实现

在做测控类的嵌入式系统开发时,一个精美的上位机控制软件UI是可以为系统增色不少,一般会采用组态软件来开发,我们来看看下面的界面 是不是非常直观有工业质感,还可以根据实时数据进行动态的显示和动画效果,那这些炫酷的…

自定义切换整行上下位置快捷键

自定义切换整行上下位置快捷键 在File菜单中选择Settings选项,搜索move li 先删掉原来的快捷键 再添加你要设置的快捷键 确认就可以了。

word转Markdown文件的几个方法

word转Markdown文件的几个方法 1、 安装writage 软件,但是writage 需要收费了。 如果只是markdown文本编辑,可以直接安装typora来。 2. 利用Pandoc软件来转换word文件到markdown文件 注意doc文件需要保存docx文件格式才可以使用下面命令行 pandoc &q…

C++多线程学习(十六、STL算法中的并行版本,sequenced_policy)

目录 sequenced_policy 使用代码: 准备 代码 结果: sequenced_policy 增加参数:sequenced_policy提供相应并行版算法 execution::seq并行算法执行可以不并行化execution::par并行算法执行可以并行化execution::par_unseq并行算法执行的可以并行以…

C#基础学习_泛型集合List<T>

C#基础学习_泛型集合List 为什么要使用集合? 数组元素个数是固定的,数组一旦定义,就无法改变元素总数。如果需求变化,则必须修改源码。 如果初始化元素总数非常大,则会造成浪费。 集合的特点: 根据需要动态增加元素个数,没有限制 List泛型集合的存储结构,与数组类似,…

Ceres-Solver 官方文档

Ceres-Solver 官方文档 Non-linear Least Squares1. Introduction2. Hello World!3. Derivatives3.1 Numeric Derivatives3.2 Analytic Derivatives3.3 More About Derivatives 4. Powell’s Function5. Curve Fitting6. Robust Curve Fitting7. Bundle Adjustment8. Other Exa…

hive on spark小文件问题【hive.merge.sparkfiles参数不生效】

hive on spark小文件问题【hive.merge.sparkfiles参数不生效】 我也是查看了我们目前集群的版本是spark是3.2.3版本 hive是3.1.3版本,都是比较新的版本,正常是支持这个参数的 在测试环境中,如果在sql中不使用group by函数其实可以可以生效的…

响应式编程实战(08)-WebFlux,使用注解编程模式构建异步非阻塞服务

1 引言 明确了 Spring 家族中 WebFlux 组件诞生的背景和意义。作为一款新型的 Web 服务开发组件: 充分考虑了与原有 Spring MVC 在开发模式上的兼容性,开发人员仍然可以使用基于注解的编程方式来创建响应式 Web 服务WebFlux 也引入了基于函数式编程的全…

Linux下有名管道mkfifo使用

Linux下实现进程通信的方式有很多种,今天要说的是有名管道,有名管道比命名管道的优势是可以在任何进程之间传递数据。有名管道通信是依赖于管道文件这种特殊类型文件来进行的。 目录 1.mkfifo命令 2.mkfifo库函数 1.mkfifo命令 mkfifo命令可以创建管…

HuilderX 运行到 MUMU模拟器

1.网易官网下载MuMu模拟器,一定要打开MuMu模拟器; MuMu模拟器官方下载https://mumu.163.com/ 2.到MUMU模拟器的安装目录,找到adb.exe在的目录下,复制其路径; 举例 :D:/Program Files/MuMuPlayer-12.0/sh…

CSPM(项目管理专业人员能力评价)和软考有什么区别?

一、国标项目管理(项目管理专业人员能力评级)证书是什么? 《项目管理专业人员能力评价要求》(GB/T 41831-2022)是2022年10月12日开始实施的一项中国国家标准,归口于全国项目管理标准化技术委员会。 《项目…

一种环肽52661-98-0,cyclo(Gly-Ser),环(甘氨酰-L-丝氨酰),氨基酸中间体

资料编辑|陕西新研博美生物科技有限公司小编MISSwu cyclo(Gly-Ser)(CAS号:52661-98-0)一种环肽,一般作为氨基酸中间体,含有甘氨酰和丝氨酰,Ser Serine 丝氨酸,也称β羟基丙氨酸,丝氨…

促进协作、提高生产力:育碧选择Perforce Helix Core的原因

Perforce Helix Core成为育碧(Ubisoft)的主要源代码控制工具已经超过六年了,被团队中的程序员和美术人员在大部分项目中使用。在育碧蒙特利尔工作室,有超过1,200名的开发人员使用Perforce Helix Core来储存源代码和数字资产&#…

Appium xpath定位

xpath应该是最准确的定位方式,不管你有没有id、class或者其他的元素,uiautomator总是可以识别出xpath,因为手机APP的控件布局类似于HTML的树形结构。 如右图所示 xpath很长,显然不可能人手动来对其进行编写,最好的就是…

算法竞赛备赛之经典基础算法训练提升,暑期集训营培训

目录 1.排序 1.1.快速排序 1.2.归并排序 2.二分 2.1.整数 2.2.浮点数 3.高精度 3.1.高精度加法 3.2.高精度减法 3.3.高精度乘法 3.4.高精度除法 4.前缀和 5.差分 6.双指针算法 7.位运算 8.离散化 8.1.unique函数实现 9.区间合并 1.排序 1.1.快速排序 快速排…

vue 运行时正常,打包却报错

解决方法:删除vue-cli 自带的压缩 plugin:OptimizeCssnanoPlugin 具体操作:找到vue.config.再添加如下删除配置

万万没想到!!号称国内Java八股文天花板(典藏版)首次开源

应届毕业生的第一份工作干多久跳槽比较合适? 都说现在应届毕业生找工作跳槽频繁,而所有用人单位都希望招揽的人才能一直在公司里干下去,但是人各有志,作为劳动者的应届毕业生有自主选择职业的权利,这就造成很多应届生…

今天分享:智能ai绘画软件哪个好

在一个遥远的未来,艺术界经历了一场革命性的变革。艺术家们不再依赖传统的画笔和颜料,而是转向了ai绘画工具,这是一种集人工智能和创造力于一身的技术。在这个世界中,我有幸遇到了一个与众不同的艺术家,他的名字叫亚历…

Hubspot为什么这么牛?国内有哪些类似软件

国外CRM圈内,除了大佬Salesforce外,还有HubSpot、Oracle、SAP等知名CRM公司。其中,HubSpot在国外2023年最佳CRM软件排行榜中名列第四,在最佳免费CRM软件排行榜中名列第二,我们先来看下它到底有多优秀,然后再…