微信小程序---小程序文档配置(2)

news2025/1/16 5:46:45

一、小程序文档配置

1、小程序的目录结构

1.1、目录结构

小程序包含一个描述整体程序的 app 和多个描述各自页面的 page
一个小程序主体部分由三个文件组成,必须放在项目的根目录
在这里插入图片描述

比如当前我们的《第一个小程序》项目根目录下就存在这三个文件:
在这里插入图片描述

1.2、pages目录
一个小程序页面由四个文件组成,分别是
项目根目录下的pages目录存放的是小程序中的页面,小程序每个页面都由4个文件组成, 分别为:
在这里插入图片描述

注意:为了方便开发者减少配置项,描述页面的四个文件必须具有相同的路径与文件名
例如:《第一个小程序》项目中的pages目录
在这里插入图片描述

例如:index页面文件夹中
在这里插入图片描述

2、全局配置 app.json

2.1 app.json概述

小程序根目录下的 app.json 文件用来对微信小程序进行全局配置,决定页面文件的路径、窗口表
现、设置网络超时时间、设置多 tab 等

  • 注意:
    1)app.json中不能添加任何注释,否则会报错
    2)字符串用户双引号引起来。
    在这里插入图片描述

上图中我们看到app.json中实际保存的是小程序的主配置项属性列表,app.json中常见的属性设置有以
下几项:
在这里插入图片描述

2.2、各项属性说明

2.2.1、pages

值是一个数组,数组的每一项都字符串,用来指定小程序由哪些页面组成。每一项代表对应页面【路径
+文件名(不包含后缀名)】的信息。数组的第一项代表小程序的初始页面。
注意:小程序每新增一个页面,相应的在pages中就需要增加多一个配置页面记录;反之亦然。
在这里插入图片描述
在这里插入图片描述

2.2.2、window

用于设置小程序的状态栏、导航条、标题、窗口背景色。

在这里插入图片描述
示例:
在这里插入图片描述

2.2.3、tabBar

tabBar 支持的属性:

  • 当设置 position 为 top 时,将不会显示 icon。
  • tabBar 中的 list 是一个数组,只能配置最少2个、最多5个tab,tab 按数组的顺序排序。

在这里插入图片描述
tabBar 中list支持的属性:
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

2.2.4、networkTimeout
用于设置各种网络请求的超时时间
在这里插入图片描述

注意:上线之前一定要设置一下超时时间,不然小程序有可能出现下列情况。
示例:
在这里插入图片描述

2.2.5、debug
用于在开发者工具中开启 debug 模式,在开发者工具的控制台面板,调试信息以 info 的形式给出,其
信息有 Page 的注册,页面路由,数据更新,事件触发。可以帮助开发者快速定位一些常见的问题,默
认为开启状态。
在开发阶段,建议打开 debug。上线时请关闭此选项,设置为 false。

{
"pages": [
"pages/index/index",
"pages/logs/index"
],
"window": {
"navigationBarTitleText": "Demo"
},
"tabBar": {
"list": [{
"pagePath": "pages/index/index",
"text": "首页"
}, {
"pagePath": "pages/logs/index",
"text": "日志"
}]
},
"networkTimeout": {
"request": 10000,
"downloadFile": 10000
},
q "debug": true
}

开发文档:https://developers.weixin.qq.com/miniprogram/dev/framework/config.html

3、页面配置文件 *.json

每个小程序页面也可以使用同名 *.json 文件来对本页面的窗口表现进行配置,页面中配置项会覆盖
app.json 的 window 中相同的配置项。
用于设置小程序的状态栏、导航条、标题、窗口背景色。

开发文档:https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html

静态配置参考

{
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black",
"navigationBarTitleText": "微信接口功能演示",
"backgroundColor": "#eeeeee",
"backgroundTextStyle": "light"
}

例如:
在这里插入图片描述

动态设置
使用微信提供的API接口
语法:wx.setNavigationBarTitle(Object object)
在这里插入图片描述

4、sitemap配置

开发文档:https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/sitemap.
html
微信现已开放小程序内搜索,开发者可以通过 sitemap.json 配置,或者管理后台页面收录开关来配
置其小程序页面是否允许微信索引 ; 当开发者允许微信索引时,微信会通过爬虫的形式,为小程序的
页面内容建立索引。当用户的搜索词条触发该索引时,小程序的页面将可能展示在搜索结果中。

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

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

相关文章

【论文速读】|探索ChatGPT在软件安全应用中的局限性

本次分享论文:Exploring the Limits of ChatGPT in Software Security Applications 基本信息 原文作者:Fangzhou Wu, Qingzhao Zhang, Ati Priya Bajaj, Tiffany Bao, Ning Zhang, Ruoyu "Fish" Wang, Chaowei Xiao 作者单位:威…

day08-Java常用API

day08——Java常用API 一、今日内容介绍、API概述 各位同学,我们前面已经学习了面向对象编程,使用面向编程这个套路,我们需要自己写类,然后创建对象来解决问题。但是在以后的实际开发中,更多的时候,我们是…

Linux软硬链接及动静态库

软硬链接与动静态库 软连接 创建链接的方法: ln -s test1.txt test2.txt 其中ln 是link(链接),-s 是soft(软),后者链接前者。 此时打开test2.txt,发现其中内容与test.txt一致。那么软连接到底建立了什么联系?…

Python函数进阶:四大高阶函数、匿名函数、枚举、拉链与递归详解

系列文章目录 Python数据类型:编程新手的必修课深入探索Python字符串:技巧、方法与实战Python 函数基础详解Python正则表达式详解:掌握文本匹配的魔法Python文件操作宝典:一步步教你玩转文件读写Python面向对象基础与魔法方法详解…

添加webpack.config.js配置

webpack 命令默认会去根目录查找webpack.config.js配置文件,如果没有,则会使用webpack默认的零配置打包规则进行打包,默认的零配置打包规则主要包括下面这几点: 1. 默认入口文件:Webpack 默认会将 ./src/index.js 作为…

“壕无人性”的沙特也要买量子计算机!巨头沙特阿美的合作方竟是它?

内容来源:量子前哨(ID:Qforepost) 文丨浪味仙 排版丨沛贤 深度好文:1200字丨5分钟阅读 摘要:石油巨头沙特阿美与 Pasqal 开启合作,计划于 2025 年部署一台 200 量子比特的量子计算机&#xff…

开源大模型与闭源大模型:技术哲学的较量

目录 前言一、 开源大模型的优势1. 社区支持与合作1.1 全球协作网络1.2 快速迭代与创新1.3 共享最佳实践 2. 透明性与可信赖性2.1 审计与验证2.2 减少偏见与错误2.3 安全性提升 3. 低成本与易访问性3.1 降低研发成本3.2 易于定制化3.3 教育资源丰富 4. 促进标准化5. 推动技术进…

【qt】QDockWidget 浮动窗口

QDockWidget 浮动窗口 一.QDockWidget 的用法 前言:很简单,放心食用 一.QDockWidget 的用法 太简单了,直接来吧! 直接做个小项目来了解QDockWidget 的用法 目标效果图: 开始拖放: 开始布局: …

Jenkins pipeline发布前端项目

说明:第一次使用jenkins生成pipeline片段,做个记录... 1.全局工具配置添加自定义node版本 2.系统管理添加前端应用部署服务器 2.1 点击高级选择账号密码验证方式,添加服务器的用户和密码 3.系统管理--凭据--系统--全局凭据--添加自己的git凭据…

R语言数据分析案例-巴西固体燃料排放量预测与分析

1 背景 自18世纪中叶以来,由于快速城市化、人口增长和技术发展,导致一氧化二氮(N2O)、 甲烷(CH4)和二氧化碳(CO 2)等温室气体浓度急剧上升,引发了全球变暖、海平面上 升…

[Cocos Creator 3.5赛车游戏]第5节 为汽车节点挂载自定义脚本

在前面的章节中您已经学会了如何创建一个汽车节点,这一章我们将会学习如何通过挂载自定义节点的方式让小车变得可控制,所以通过这一章的学习后,您将实现一个效果:开始运行后,小车每隔一帧就延y轴向上移动一段距离。在这…

vs无法打开或包括文件”QTxxx“

vs创建项目时默认引入core、gui、和widgets等模块,在需要网络通讯或者图表等开发时需要添加相应模块。 点击扩展 -> QT VS Tools -> QT Project Setting->Qt Modules,添加相应模块即可

OpenAI、微软、智谱AI 等全球 16 家公司共同签署前沿人工智能安全承诺

人工智能(AI)的安全问题,正以前所未有的关注度在全球范围内被讨论。 日前,OpenAI 联合创始人、首席科学家 Ilya Sutskever 与 OpenAI 超级对齐团队共同领导人 Jan Leike 相继离开 OpenAI,Leike 甚至在 X 发布了一系列…

Java中Spring MVC 来如何接收表单数据

目录 一、Java语言介绍 二、Spring MVC 框架介绍 三、什么是表单 四、Spring MVC 来如何接收表单数据 一、Java语言介绍 Java是一种广泛使用的面向对象的编程语言,由Sun Microsystems公司的James Gosling等人开发。它最初于1995年发布,被设计为具有…

以人为本的人工智能:李飞飞谈AI

随着人工智能(AI)技术的迅猛发展,关于AI的讨论越来越多,特别是围绕其可能带来的威胁。有人担心高效的AI会夺走我们的工作,甚至不可控的AI最终会统治人类。对此,斯坦福大学计算机科学系教授李飞飞提出了不同…

【bug解决】文件chunk分包上传中断报错

文章目录 报错信息原因分析解决方案 一天闲着无聊,打开项目线上报错日志信息,突然发现一段很奇怪的报错:MultipartException,主观认为导致这个问题的原因无非就几个原因: 文件上传格式大小超出限制,在配置文…

Llama 3超级课堂作业笔记

文章目录 基础作业完成 Llama 3 Web Demo 部署环境配置下载模型Web Demo 部署对话截图 使用 XTuner 完成小助手认知微调Web Demo 部署自我认知训练数据集准备训练模型推理验证 使用 LMDeploy 成功部署 Llama 3 模型环境,模型准备LMDeploy CLI chatLMDeploy模型量化(…

访问列表元素

自学python如何成为大佬(目录):https://blog.csdn.net/weixin_67859959/article/details/139049996?spm1001.2014.3001.5501 在Python中,如果想将列表的内容输出也比较简单,可以直接使用print()函数即可。例如,创建一个名称为untitle的列表…

python-docx 在word中指定位置插入图片或表格

docx库add_picture()方法不支持对图片位置的设置 1、新建一个1行3列的表格,在中间的一列中插入图片 from docx import Document from docx.shared import Pt from docx.oxml.shared import OxmlElement from docx.enum.text import WD_ALIGN_PARAGRAPHdef add_cen…

谷歌开源项目BERT源码解读与应用实例

数据及代码见文末 基于BERT的中文情感分析实战:基于BERT的中文情感分析实战-CSDN博客 基于BERT的中文命名实体识别识别实战:基于BERT的中文命名实体识别识别实战-CSDN博客 1.项目配置文件 GLUE/BERT_BASE_DIR是项目的预训练权重,预训练权重主要包含3个部分:参数配置文件…