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

微信小程序页面配置

页面配置

小程序的配置可以配置页面路径、窗口表现、tabBar等,分为全局配置和页面配置,全局配置针对所有页面生效,页面配置只针对当前页生效。

全局配置 (app.json)

(1) 路径配置

pages 配置页面路径,未配置路径的页面无法被访问到

技巧 : 创建一个页面文件时, 在pages中添加一个配置项, 小程序开发工具自动把文件创建出来,不需要手动创建

//app.json 中
{"pages": ["pages/index/index","pages/home/home","pages/info/info",],
}

(2) 起始页配置

entryPath 配置小程序默认的启动页面(首页) 如果不填,将默认为 pages 列表的第一项

 {"entryPagePath": "pages/home/home",}

(3) window窗口配置

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

 "window": {"enablePullDownRefresh": true,//窗口配置"backgroundColor": "#eee","backgroundTextStyle": "dark",//导航栏的配置  "navigationBarBackgroundColor": "#FFA500", "navigationBarTextStyle": "white","navigationBarTitleText": "我的小程序","navigationStyle": "default"},

窗口的配置

  • backgroundColor 窗口的背景色

导航栏的配置

  • navigationBarBackgroundColor 导航栏背景颜色 (颜色是十六进制)

  • navigationBarTextStyle 导航栏标题颜色,仅支持 black / white

  • navigationBarTitleText 导航栏标题文字内容

  • navigationStyle 导航栏样式,仅支持以下值: default 默认样式 custom 自定义导航栏

下拉刷新的配置

  • backgroundTextStyle 下拉 loading 的样式,仅支持 dark / light
  • enablePullDownRefresh 是否开启全局的下拉刷新。

(4) tabBar 配置

tabBar 底部 Tab 栏(tabBar 中的页面必须配置在 pages 中)

 "tabBar": {"color": "#999","selectedColor": "#5792AF","backgroundColor": "#e0e0e0","borderStyle": "white","position": "bottom","list": [{"pagePath": "pages/home/home","text": "我的","iconPath": "/assets/icon/home.png","selectedIconPath": "/assets/icon/home-active.png"},]},
  • color 文字颜色,仅支持十六进制颜色
  • selectedColor 文字选中时的颜色,仅支持十六进制颜色
  • backgroundColor tab 的背景色,仅支持十六进制颜色
  • borderStyle tabbar上边框的颜色 , 仅支持 black / white
  • list tabBar 页面跳转的路径图标配置
  • pagePath 跳转的页面路径
  • text tabBar 上按钮文字
  • iconPath 图片路径 icon 大小限制为 40kb,不支持网络图片。 当 position 为 top 时,不显示 icon。
  • selectedIconPath 选中时的图片路径
  • position tabBar 的位置,仅支持 bottom / top
页面配置

页面配置大部分与全局配置中的 window 是重叠的,页面配置的优先级大于全局配置的。

  • disableScroll 只能用在在页面配置中,禁用页面滚动
  • usingComponents 后续学到自定义组件时再介绍

相关文章:

微信小程序页面配置

页面配置 小程序的配置可以配置页面路径、窗口表现、tabBar等,分为全局配置和页面配置,全局配置针对所有页面生效,页面配置只针对当前页生效。 全局配置 (app.json) (1) 路径配置 pages 配置页面路径,未配置路径的页面无法被访…...

如何将JPG/PNG位图免费快速一键转换成SVG格式的矢量图

环境: JPG/PNG位图 问题描述: 如何将JPG/PNG位图快速一键转换成SVG格式的矢量图 解决方案: 是一个人工智能驱动的图片转换工具,可以帮助用户将」JPG/PNG位图快速转换成SVG格式的矢量图,方便设计人员对图片进行二次…...

YOLO检测环境安装配置

YOLO介绍 YOLO学习手册:YOLO教程 YOLO [ˈjoʊloʊ](You Only Look Once)是一种快速而准确的目标检测算法,由Joseph Redmon等人在2016年提出。YOLO被广泛应用于计算机视觉领域,包括实时视频分析、自动驾驶、安防监控、…...

NOSQL -- ES

第三个我们比较常用的NOSQL类型的数据库 --- ES 介绍: ES的全称(Elasticsearch) ES是一个分布式全文搜索的引擎 也就是我们平常在购物, 搜索东西的时候常用的, 就是一个ES的类型, 分布式全文搜索引擎 查询原理: 1>分词: 在查询之前, 其会将一些数据拆分开, 按照词进行拆分…...

【Python基础】名称空间和作用域

1.名称空间 将栈区进行分类,这些分类就是名称空间 名称空间存放什么名字空间个数何时创建&销毁内置名称空间built-inPython解释器内置的名字1个Python解释器启动&解释器关闭 全局名称空间 global Python文件内定义的类名,变量名,模块…...

安全智能预警软件有人试图窃取会立即发出高分贝警报已解锁VIP功能

一款手机安全智能预警软件,无论是网吧还是餐馆小聚,您的手机都能得到贴心的守护,一旦有人试图窃取,应用会立即发出高分贝警报,确保您在公交、地铁、商场等拥挤环境中依然能牢牢掌控手机。(解锁专业版&#…...

DeepSORT(目标跟踪算法)中自由度决定卡方分布的形状

DeepSORT(目标跟踪算法)中自由度决定卡方分布的形状 flyfish 重要的两个点 自由度决定卡方分布的形状(本文) 马氏距离的平方在多维正态分布下服从自由度为 k 的卡方分布 独立的信息 在统计学中,独立的信息是指数据…...

cordic IP核中,sin and cos的使用

参考视频:FPGA IP之CORDIC_哔哩哔哩_bilibili FPGA IP之CORDIC使用与仿真_哔哩哔哩_bilibili 一、参数说明 functional selection rotate是旋转,sin and cos是计算这两个三角函数,sinh和cosh是计算双曲正弦和双曲余弦 phase format 对于…...

SpringSecurity入门(三)

12、密码加密 12.1、不指定具体加密方式,通过DelegatingPasswordEncoder,根据前缀自动选择 PasswordEncoder passwordEncoder PasswordEncoderFactories.createDelegatingPasswordEncoder();12.2、指定具体加密方式 // Create an encoder with streng…...

luogu-P10570 [JRKSJ R8] 网球

题目传送门: [JRKSJ R8] 网球 - 洛谷https://www.luogu.com.cn/problem/P10570 解题思路 数学问题,暴力这个范围会超时。 首先,找出这两个数的最大公因数,将这两个数分别除以最大公因数,则这两个数互质,判…...

ASP.NET的WebService跨域CORS问题解决方案

ASP.NET WebService 跨域(CORS, Cross-Origin Resource Sharing)问题通常发生在当您尝试从不同的源(域名、协议或端口)调用 WebService 时。浏览器由于安全原因,默认会阻止此类跨域请求。为了解决这个问题,您需要在 WebService 服务器端配置 CORS。 以下是在 ASP.NET We…...

大众点评全国爱车店铺POI采集177万家-2024年5月底

大众点评全国爱车店铺POI采集177万家-2024年5月底 店铺POI点位示例: 店铺id H69Y6l1Ixs2jLGg2 店铺名称 HEEJOO豪爵足道(伍家店) 十分制服务评分 7.7 十分制环境评分 7.7 十分制划算评分 7.7 人均价格 134 评价数量 2982 店铺地址 桔城路2号盛景商业广场1-3…...

【文献阅读】LORA: LOW-RANK ADAPTATION OF LARGE LANGUAGE MODELS

目录 1. motivation2. overall3. model3.1 low rank parametrized update matrices3.2 applying lora to transformer 4. limitation5. experiment6. 代码7. 补充参考文献 1. motivation 常规的adaptation需要的微调成本过大现有方法的不足: Adapter Layers Introd…...

Rust学习06:使用CSDN的AI工具“C知道”分析代码错误

朋友们,我最近真的是在绝望的边缘了! Rust咋这么蓝涅! 资料咋这们少涅! 记得学Python的时候,基本上你遇到的所有问题都可以在书上或者网上找到答案,中文世界找不到那么在英文世界一定能找到答案。 我猜&…...

MeiliSearch-轻量级且美丽的搜索引擎

MeiliSearch-轻量级且美丽的搜索引擎 MeiliSearch 是一个功能强大、快速、开源、易于使用和部署的搜索引擎。它具有以下特点: 支持中文搜索:MeiliSearch 对中文有良好的支持,不需要额外的配置。高度可定制:搜索和索引都可以高度…...

python使用wkhtmltopdf将html字符串保存pdf,解决出现方框的问题

出现的问题&#xff1a; 解决办法&#xff1a; <html> <head><meta charset"UTF-8"/> </head> <style> * {font-family: Arial,SimSun !important; } </style> </html>在html字符串前面加上上面代码&#xff0c;意思是设…...

Java练习题

题目&#xff1a; 1. 定义长方体类Cuboid&#xff0c;要求如下&#xff1a;&#xff08;1&#xff09;私有成员变量包括长length、宽width和高height&#xff1b;&#xff08;2&#xff09;构造方法包括一个公共的空构造方法&#xff0c;一个能够初始化所有成员变量的构造方法…...

【Python/Pytorch - 网络模型】-- 手把手搭建U-Net模型

文章目录 文章目录 00 写在前面01 基于Pytorch版本的UNet代码02 论文下载 00 写在前面 通过U-Net代码学习&#xff0c;可以学习基于Pytorch的网络结构模块化编程&#xff0c;对于后续学习其他更复杂网络模型&#xff0c;有很大的帮助作用。 在01中&#xff0c;可以根据U-Net…...

Ansible-doc 命令

目录 常用参数 基本用法 查看指定模块的文档 列出所有可用模块 搜索模块 显示模块参数的简单列表 显示详细的说明和示例 详细示例 查看 file 模块的文档 简略查看 copy 模块的参数 ansible-doc 是 Ansible 中的一个非常有用的命令行工具&#xff0c;它可以帮助你查找…...

面试题:什么是线程的上下文切换?

线程的上下文切换是指在操作系统中&#xff0c;CPU从执行一个线程的任务切换到执行另一个线程任务的过程。在现代操作系统中&#xff0c;为了实现多任务处理和充分利用CPU资源&#xff0c;会同时管理多个线程的执行。由于CPU在任意时刻只能执行一个线程&#xff0c;因此需要在这…...

SpringBoot-17-MyBatis动态SQL标签之常用标签

文章目录 1 代码1.1 实体User.java1.2 接口UserMapper.java1.3 映射UserMapper.xml1.3.1 标签if1.3.2 标签if和where1.3.3 标签choose和when和otherwise1.4 UserController.java2 常用动态SQL标签2.1 标签set2.1.1 UserMapper.java2.1.2 UserMapper.xml2.1.3 UserController.ja…...

RocketMQ延迟消息机制

两种延迟消息 RocketMQ中提供了两种延迟消息机制 指定固定的延迟级别 通过在Message中设定一个MessageDelayLevel参数&#xff0c;对应18个预设的延迟级别指定时间点的延迟级别 通过在Message中设定一个DeliverTimeMS指定一个Long类型表示的具体时间点。到了时间点后&#xf…...

Java如何权衡是使用无序的数组还是有序的数组

在 Java 中,选择有序数组还是无序数组取决于具体场景的性能需求与操作特点。以下是关键权衡因素及决策指南: ⚖️ 核心权衡维度 维度有序数组无序数组查询性能二分查找 O(log n) ✅线性扫描 O(n) ❌插入/删除需移位维护顺序 O(n) ❌直接操作尾部 O(1) ✅内存开销与无序数组相…...

【位运算】消失的两个数字(hard)

消失的两个数字&#xff08;hard&#xff09; 题⽬描述&#xff1a;解法&#xff08;位运算&#xff09;&#xff1a;Java 算法代码&#xff1a;更简便代码 题⽬链接&#xff1a;⾯试题 17.19. 消失的两个数字 题⽬描述&#xff1a; 给定⼀个数组&#xff0c;包含从 1 到 N 所有…...

sqlserver 根据指定字符 解析拼接字符串

DECLARE LotNo NVARCHAR(50)A,B,C DECLARE xml XML ( SELECT <x> REPLACE(LotNo, ,, </x><x>) </x> ) DECLARE ErrorCode NVARCHAR(50) -- 提取 XML 中的值 SELECT value x.value(., VARCHAR(MAX))…...

GitHub 趋势日报 (2025年06月08日)

&#x1f4ca; 由 TrendForge 系统生成 | &#x1f310; https://trendforge.devlive.org/ &#x1f310; 本日报中的项目描述已自动翻译为中文 &#x1f4c8; 今日获星趋势图 今日获星趋势图 884 cognee 566 dify 414 HumanSystemOptimization 414 omni-tools 321 note-gen …...

用docker来安装部署freeswitch记录

今天刚才测试一个callcenter的项目&#xff0c;所以尝试安装freeswitch 1、使用轩辕镜像 - 中国开发者首选的专业 Docker 镜像加速服务平台 编辑下面/etc/docker/daemon.json文件为 {"registry-mirrors": ["https://docker.xuanyuan.me"] }同时可以进入轩…...

企业如何增强终端安全?

在数字化转型加速的今天&#xff0c;企业的业务运行越来越依赖于终端设备。从员工的笔记本电脑、智能手机&#xff0c;到工厂里的物联网设备、智能传感器&#xff0c;这些终端构成了企业与外部世界连接的 “神经末梢”。然而&#xff0c;随着远程办公的常态化和设备接入的爆炸式…...

力扣热题100 k个一组反转链表题解

题目: 代码: func reverseKGroup(head *ListNode, k int) *ListNode {cur : headfor i : 0; i < k; i {if cur nil {return head}cur cur.Next}newHead : reverse(head, cur)head.Next reverseKGroup(cur, k)return newHead }func reverse(start, end *ListNode) *ListN…...

Scrapy-Redis分布式爬虫架构的可扩展性与容错性增强:基于微服务与容器化的解决方案

在大数据时代&#xff0c;海量数据的采集与处理成为企业和研究机构获取信息的关键环节。Scrapy-Redis作为一种经典的分布式爬虫架构&#xff0c;在处理大规模数据抓取任务时展现出强大的能力。然而&#xff0c;随着业务规模的不断扩大和数据抓取需求的日益复杂&#xff0c;传统…...