当前位置: 首页 > news >正文

学习笔记(2)项目结构描述 - manifest.json和pages.json

目录

  • 1,manifest.json
  • 2,pages.json
    • 2.1,pages
    • 2.2,globalStyle
    • 2.3,tabBar

1,manifest.json

官方详情
uni-app 的 appid 由 DCloud 云端分配,主要用于 DCloud 相关的云服务,请勿自行修改。

2,pages.json

官方详情

2.1,pages

uni-app 通过 pages 节点配置应用由哪些页面组成,pages 节点接收一个数组,数组每个项都是一个对象,其属性值如下:

pages": [//pages数组中第一项表示应用启动页,{"path": "pages/index/index",  //配置页面路径/** style,配置页面窗口表现,是一个对象。用于设置每个页面的状态栏、导航条、标题、窗口背景色等。* 页面中配置项会覆盖 globalStyle 中相同的配置项。* 地址:https://uniapp.dcloud.net.cn/collocation/pages.html#style*/"style": {"navigationBarTitleText": "",  //导航栏标题文字内容//设置编译到 App 平台的特定样式"app-plus": {"titleNView": false}}},{"path": "pages/tabBar/home","style": {"navigationBarTitleText": "","navigationBarBackgroundColor": "#457AE6",  //导航栏背景颜色(同状态栏背景色),如"#000000""backgroundColor": "#F4F5F7",  //窗口的背景色"app-plus": {"titleNView": false}}},
]
  • 应用中新增/减少页面,都需要对 pages 数组进行修改。
  • 文件名不需要写后缀,框架会自动寻找路径下的页面资源。

2.2,globalStyle

详情
用于设置应用的状态栏、导航条、标题、窗口背景色等。

"globalStyle": {"navigationBarTextStyle": "white", //导航栏标题颜色及状态栏前景颜色,"navigationBarTitleText": "uni-app", //导航栏标题文字内容"navigationBarBackgroundColor": "#457AE6", //导航栏背景颜色(同状态栏背景色)"backgroundColor": "#F4F5F7",  //下拉显示出来的窗口的背景色"app-plus": {"backgroundColor": "#F4F5F7"}  //设置编译到 App 平台的特定样式,// "pageOrientation": "portrait-primary"
},

2.3,tabBar

详情

设置底部tab

  • 当设置 position 为 top 时,将不会显示 icon
  • tabBar 中的 list 是一个数组,只能配置最少2个、最多5个 tab,tab 按数组的顺序排序。
  • tabbar 切换第一次加载时可能渲染不及时,可以在每个tabbar页面的onLoad生命周期里先弹出一个等待雪花(hello uni-app使用了此方式) tabbar 的页面展现过一次后就保留在内存中,再次切换 tabbar 页面,只会触发每个页面的onShow,不会再触发onLoad。

例子:项目底部导航栏配置

"tabBar": {"color": "#909399",  //tab 上的文字默认颜色"selectedColor": "#303133",  //tab 上的文字选中时的颜色"backgroundColor": "#FFFFFF",  //tab 的背景色"borderStyle": "white","list": [{"pagePath": "pages/tabBar/home",  //页面路径,必须在 pages 中先定义图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px,当 position 为 top 时,此参数无效,不支持网络图片,不支持字体图标"iconPath": "static/images/home.png",  //选中时的图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px ,当 position 为 top 时,此参数无效"selectedIconPath": "static/images/home_select.png","text": "首页"  //tab 上按钮文字,在 App 和 H5 平台为非必填。例如中间可放一个没有文字的+号图标}, {"pagePath": "pages/tabBar/financing","iconPath": "static/images/yunxin.png","selectedIconPath": "static/images/yunxin_select.png","text": "产品中心"},{"pagePath": "pages/tabBar/accountCenter","iconPath": "static/images/account.png","selectedIconPath": "static/images/account_select.png","text": "账户中心"}]
},

相关文章:

学习笔记(2)项目结构描述 - manifest.json和pages.json

目录 1,manifest.json2,pages.json2.1,pages2.2,globalStyle2.3,tabBar 1,manifest.json 官方详情 uni-app 的 appid 由 DCloud 云端分配,主要用于 DCloud 相关的云服务,请勿自行修…...

vector、deque、list相关知识点

vector erase返回迭代器指向删除元素后的元素insert返回迭代器指插入的元素reserve只给容器底层开指定大小内存空间,并不添加新元素 deque 底层数据结构 动态开辟的二维数组,一维数组从2开始,以2倍方式扩容,每次扩容和&#x…...

多维时序 | MATLAB实现基于VMD-SSA-LSSVM、SSA-LSSVM、VMD-LSSVM、LSSVM的多变量时间序列预测对比

多维时序 | MATLAB实现基于VMD-SSA-LSSVM、SSA-LSSVM、VMD-LSSVM、LSSVM的多变量时间序列预测对比 目录 多维时序 | MATLAB实现基于VMD-SSA-LSSVM、SSA-LSSVM、VMD-LSSVM、LSSVM的多变量时间序列预测对比预测效果基本介绍程序设计学习总结参考资料 预测效果 基本介绍 多维时序 …...

设计模式——适配器模式(类适配器、对象适配器)

是什么? 我们平时的有线耳机接口分为USB的和Type-C的接口,但是手机的耳机插口却只有一个,像华为的耳机插口现在基本都是Type-c的,那如果我们现在只有USB接口的耳机怎么办呢,这个时候就需要使用到一个转换器&#xff0c…...

iOS开发多target

场景 背景:设想一下有一个场景,一个业务分为多种身份,他们大部分功能是相同的,但是也有自己的差异性。这种情况,想要构建出不同身份的APP。你会怎么做??? 当然,你可以拷贝一份代码出来,给项目重新命名。这样做的好处是,他们互相不会冲突,不用去关心是否有逻辑的冲…...

100种思维模型之每日评估思维模型-58

曾子曰:吾日三省吾省,为人谋而不忠乎?与朋友交不信乎?传不习乎? 曾国藩,坚持每日写复盘日记,最后他用自己的实践经历向我们证明:一个智商很平庸、出身很普通且有着各种毛病的人&…...

libreoffice api

libreOffice API是用于访问libreOffice的编程接口。可以使用libreOffice API创建、打开、修改和打印libreOffice文档。 LibreOffice API支持Basic、Java、C/C、Javascript、Python语言。 这是通过一种称为通用网络对象 (Universal Network Objects, UNO) 的技术实现的&#xff…...

全网最火,Web自动化测试驱动模型详全,一语点通超实用...

目录:导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结(尾部小惊喜) 前言 自动化测试模型&a…...

如何写软件测试简历项目经验,靠这个面试都要赶场

一、前言:浅谈面试 面试是我们进入一个公司的门槛,通过了面试才能进入公司,你的面试结果和你的薪资是息息相关的。那如何才能顺利的通过面试,得到公司的认可呢?面试软件测试要注意哪些问题呢?下面和笔者一起来看看吧。这里分享一…...

【Linux】Linux下安装Mysql(图文解说详细版)

文章目录 前言第一步,进到opt文件夹下面,为什么?因为opt文件夹相当于Windows下的D://software第二步,用yum安装第三步,设置mysql的相关配置第四步,设置远程连接。第五步,更改mysql的语言第六步&…...

Cookie和Session的API、登录页面

目录 一、Cookie 和 Session 1、HttpServletRequest 类中的相关方法 2、HttpServletResponse 类中的相关方法 3、HttpSession 类中的相关方法 4、Cookie 类中的相关方法 二、网页登录 1、约定前后端交互接口 2、编写一个简单的登录页面 3、编写一个Servlet 来处理这个…...

C++数据结构:手撕红黑树

目录 一. 红黑树的概念及结构 二. 红黑树节点的定义 三. 红黑树节点的插入 3.1 初步查找插入节点的位置并插入节点 3.2 红黑树结构的调整 3.3 红黑树节点插入完整版代码 四. 红黑树的结构检查 4.1 检查是否为搜索树 4.2 检查节点颜色是否满足要求 附录:红黑…...

Spring IoC 深度学习

Io回顾 IoC 是 Inversion of Control 的简写,译为“控制反转”,它不是一门技术,而是一种设计思想,是一个重要的面向对象编程法则,能够指导我们如何设计出松耦合、更优良的程序。 Spring 通过 IoC 容器来管理所有 Jav…...

C语言从入门到精通第17天(指针和数组联用)

指针和数组联用 不同类型指针变量之间的区别数组的指针指针数组 不同类型指针变量之间的区别 在了解数组和指针联用之前,我们先对指针变量进行补充。我们对比一下int *p1和char *p2的区别? 相同点: 都是指针变量都是用来保存一个内存地址编…...

Android9.0 原生系统SystemUI下拉状态栏和通知栏视图之锁屏通知布局

1.前言 在9.0的系统rom定制化开发中,对于系统原生systemui的锁屏界面的功能也是非常重要的,所以在锁屏页面布局中,也是有通知栏布局的,所以接下来对于息屏亮屏 通知栏布局的相关流程分析,看下亮屏后锁屏页面做了哪些功能 2.原生系统SystemUI下拉状态栏和通知栏视图之锁…...

音视频八股文(10)-- mp4结构

介绍 mp4⽂件格式⼜被称为MPEG-4 Part 14,出⾃MPEG-4标准第14部分 。它是⼀种多媒体格式容器,⼴泛⽤于包装视频和⾳频数据流、海报、字幕和元数据等。(顺便⼀提,⽬前流⾏的视频编码格式AVC/H264 定义在MPEG-4 Part 10&#xff09…...

python算法中的深度学习算法之深度信念网络(详解)

目录 学习目标: 学习内容: 深度信念网络 Ⅰ. 预训练 Ⅱ. 微调 学习目标: 一分钟掌握 python算法中的深度学习算法之深度信念网络 入门知识...

SPSS如何绘制常用统计图之案例实训?

文章目录 0.引言1.绘制简单条形图2.绘制分类条形图3.绘制分段条形图4.绘制简单线图5.绘制多重线图6.绘制垂直线图7.绘制简单面积图8.绘制堆积面积图9.绘制饼图10.绘制直方图11.绘制简单散点图12.绘制重叠散点图13.绘制矩阵散点图14.绘制三维散点图15.绘制简单箱图16.绘制分类箱…...

打动人心的故事 | 如何利用文案在Facebook上塑造品牌形象

在当今的数字营销时代,文案已经成为各大平台上不可或缺的元素之一。在Facebook上,一个好的文案能够为品牌带来巨大的曝光率和用户黏性,甚至可以改变用户对品牌的看法。那么,如何利用文案在Facebook上打动人心,塑造品牌…...

什么是模糊控制?

模糊控制设计原理 1、传统控制系统和模糊控制系统 传统控制系统结构: 控制目的:通过控制器调节控制信号u,使输出信号y达到要求 模糊控制系统结构: 与传统控制系统的差异:用模糊控制器FC(Fuzzy Controller&…...

Docker 离线安装指南

参考文章 1、确认操作系统类型及内核版本 Docker依赖于Linux内核的一些特性,不同版本的Docker对内核版本有不同要求。例如,Docker 17.06及之后的版本通常需要Linux内核3.10及以上版本,Docker17.09及更高版本对应Linux内核4.9.x及更高版本。…...

【根据当天日期输出明天的日期(需对闰年做判定)。】2022-5-15

缘由根据当天日期输出明天的日期(需对闰年做判定)。日期类型结构体如下: struct data{ int year; int month; int day;};-编程语言-CSDN问答 struct mdata{ int year; int month; int day; }mdata; int 天数(int year, int month) {switch (month){case 1: case 3:…...

Golang 面试经典题:map 的 key 可以是什么类型?哪些不可以?

Golang 面试经典题:map 的 key 可以是什么类型?哪些不可以? 在 Golang 的面试中,map 类型的使用是一个常见的考点,其中对 key 类型的合法性 是一道常被提及的基础却很容易被忽视的问题。本文将带你深入理解 Golang 中…...

Java 8 Stream API 入门到实践详解

一、告别 for 循环&#xff01; 传统痛点&#xff1a; Java 8 之前&#xff0c;集合操作离不开冗长的 for 循环和匿名类。例如&#xff0c;过滤列表中的偶数&#xff1a; List<Integer> list Arrays.asList(1, 2, 3, 4, 5); List<Integer> evens new ArrayList…...

MFC内存泄露

1、泄露代码示例 void X::SetApplicationBtn() {CMFCRibbonApplicationButton* pBtn GetApplicationButton();// 获取 Ribbon Bar 指针// 创建自定义按钮CCustomRibbonAppButton* pCustomButton new CCustomRibbonAppButton();pCustomButton->SetImage(IDB_BITMAP_Jdp26)…...

Java - Mysql数据类型对应

Mysql数据类型java数据类型备注整型INT/INTEGERint / java.lang.Integer–BIGINTlong/java.lang.Long–––浮点型FLOATfloat/java.lang.FloatDOUBLEdouble/java.lang.Double–DECIMAL/NUMERICjava.math.BigDecimal字符串型CHARjava.lang.String固定长度字符串VARCHARjava.lang…...

python如何将word的doc另存为docx

将 DOCX 文件另存为 DOCX 格式&#xff08;Python 实现&#xff09; 在 Python 中&#xff0c;你可以使用 python-docx 库来操作 Word 文档。不过需要注意的是&#xff0c;.doc 是旧的 Word 格式&#xff0c;而 .docx 是新的基于 XML 的格式。python-docx 只能处理 .docx 格式…...

【决胜公务员考试】求职OMG——见面课测验1

2025最新版&#xff01;&#xff01;&#xff01;6.8截至答题&#xff0c;大家注意呀&#xff01; 博主码字不易点个关注吧,祝期末顺利~~ 1.单选题(2分) 下列说法错误的是:&#xff08; B &#xff09; A.选调生属于公务员系统 B.公务员属于事业编 C.选调生有基层锻炼的要求 D…...

今日科技热点速览

&#x1f525; 今日科技热点速览 &#x1f3ae; 任天堂Switch 2 正式发售 任天堂新一代游戏主机 Switch 2 今日正式上线发售&#xff0c;主打更强图形性能与沉浸式体验&#xff0c;支持多模态交互&#xff0c;受到全球玩家热捧 。 &#x1f916; 人工智能持续突破 DeepSeek-R1&…...

根据万维钢·精英日课6的内容,使用AI(2025)可以参考以下方法:

根据万维钢精英日课6的内容&#xff0c;使用AI&#xff08;2025&#xff09;可以参考以下方法&#xff1a; 四个洞见 模型已经比人聪明&#xff1a;以ChatGPT o3为代表的AI非常强大&#xff0c;能运用高级理论解释道理、引用最新学术论文&#xff0c;生成对顶尖科学家都有用的…...