微信小程序设计之页面文件pages
一、新建一个项目
首先,下载微信小程序开发工具,具体下载方式可以参考文章《微信小程序开发者工具下载》。
然后,注册小程序账号,具体注册方法,可以参考文章《微信小程序个人账号申请和配置详细教程》。
在得到了测试号的账号信息之后,可以在开发者工具中使用此账号信息创建项目进行开发。
点击确定后,可以在左侧看到小程序的主要界面【Hello World】。
二、pages介绍
1、pages
小程序一般会在根目录下创建一个pages文件夹用于保存所有页面文件,每个页面有自己独立的二级目录,如下图所示。
由上图可见,该项目当前由index和 logs两个页面组成。每一个单独的页面基本上由4种文件构成,即 wxml、wxss、js/ts和 json,说明如下:
- wxml文件:用于构建当前页面的结构,包括组件、事件等内容,用户最终看到的页面效果就是由该文件显示出来的。
- wxss文件:可选页面,用于设置当前页面的样式效果,该文件规定的样式会覆盖app.wxss全局样式表中产生冲突的规定,但不会影响其他页面。
- js文件:可选页面,用于设置当前页面的逻辑代码。
- json文件:可选页面,用来重新设置 app.json中 window属性规定的内容,新设置的选项只会显示在当前页面上,不会影响其他页面。
注意:为了方便开发者减少配置项,建议直接在空白页面文件夹上右击选择“新建”→Page,这样可以一次性创建描述页面的这4种文件,且它们会具有相同的路径与文件名。
2、json文件属性
json 文件的可用属性如下表所示:

如下图所示,为logs页面的导航栏的标题设置。

注意:页面的 JSON 文件只能设直与 window 相关的配置项,以决定本页面的窗口表现, 所以无须像 app.json 那样专门写 window 属性。
更多内容:
微信小程序开发笔记_珞瑜·的博客-CSDN博客
微信小程序开发者工具下载-CSDN博客
微信小程序个人账号申请和配置详细教程-CSDN博客
微信小程序设计之主体文件app-json-pages-CSDN博客
微信小程序设计之主体文件app-json-window-CSDN博客
微信小程序设计之主体文件app-json-tabBar-CSDN博客
微信小程序设计之主体文件app-ts/js-CSDN博客
微信小程序设计之主体文件app-wxss/less-CSDN博客
相关文章:
微信小程序设计之页面文件pages
一、新建一个项目 首先,下载微信小程序开发工具,具体下载方式可以参考文章《微信小程序开发者工具下载》。 然后,注册小程序账号,具体注册方法,可以参考文章《微信小程序个人账号申请和配置详细教程》。 在得到了测…...
VScode 自定义主题各参数解析
参考链接: vscode自定义颜色时各个参数的作用(史上最全)vscode编辑器,自己喜欢的颜色 由于 VScode 搜索高亮是在是太不起眼了,根本看不到此时选中到哪个搜索匹配了,所以对此进行了配置,具体想增加更多可配置项可参考…...
Linux进程等待
文章目录 1. 为什么要进程等待2. 进程等待的方法waitwaitpid非阻塞轮询 1. 为什么要进程等待 子进程退出,如果父进程还未结束,没有管这个子进程,那么就可能会造成“僵尸进程”问题,进而出现内存泄漏 如果这个进程变成了“僵尸进程…...
python设计模式笔记1:创建型模式 工厂模式和抽象工厂模式
1.工厂模式 (1) 导入所需的模块( json 和 ElementTree )。 (2) 定义 JSON数据提取器类( JSONDataExtractor )。 (3) 定义 XML数据提取器类( XMLDataExtractor )。 (4) 添加工厂函数 dataextraction_factor…...
第五章 I/O管理 一、I/O设备的基本概念和分类
目录 一、什么是I/O设备 1、定义: 2、按特性分类: 3、按传输速率分类: 4、按信息交换的方式分类: 二、总结 一、什么是I/O设备 1、定义: I/O设备就是可以将数据输入到计算机,或者可以接收计算机输出…...
vue3动态引入图片(:src)
vite 官方默认的配置,如果资源文件在assets文件夹打包后会把图片名加上 hash值,但是直接通过 :src"imgSrc"方式引入并不会在打包的时候解析,导致开发环境可以正常引入,打包后却不能显示的问题 实际上我们不希望资源文…...
Android-登录注册页面(第三次作业)
第三次作业 - 登录注册页面 题目要求 嵌套布局。使用线性布局的嵌套结构,实现登录注册的页面。(例4-3) 创建空的Activity 项目结构树如下图所示: 注意:MainActivity.java文件并为有任何操作,主要功能集中…...
[论文精读]How Powerful are Graph Neural Networks?
论文原文:[1810.00826] How Powerful are Graph Neural Networks? (arxiv.org) 英文是纯手打的!论文原文的summarizing and paraphrasing。可能会出现难以避免的拼写错误和语法错误,若有发现欢迎评论指正!文章偏向于笔记&#x…...
Redis实现分布式锁之----超时和失效(非原子性)问题----解决方案
Redis实现分布式锁之----超时和失效(非原子性)问题----解决方案 超时和失效(非原子性)问题 原子性问题:上锁时存入线程名称,删除时要先判断锁内的名称是不是自己的,是再删除,但是后…...
Android使用Hilt依赖注入,让人看不懂你代码
前言 之前接手的一个项目里有些代码看得云里雾里的,找了半天没有找到对象创建的地方,后来才发现原来使用了Hilt进行了依赖注入。Hilt相比Dagger虽然已经比较简洁,但对初学者来说还是有些门槛,并且网上的许多文章都是搬自官网&…...
ZYNQ连载01-ZYNQ介绍
ZYNQ连载01-ZYNQ介绍 1. ZYNQ 参考文档:《ug585-zynq-7000-trm.pdf》 ZYNQ分为PS和PL两大部分,PS即ARM,PL即FPGA,PL作为PS的外设。 2. 方案 ZYNQ7020为双核A9架构,多核处理器常用的运行模式为AMP(非对称多处理)和…...
第十节——Vue组件
一、什么是组件 组件(Component)是vue.js中很强大的一个功能,可以将一些可重用的代码进行封重用。 所有的Vue 组件同时也是Vue 的实例,可以接受使用相同的选项对象和提供相同的生命周期钩子。 一句话概括:组件就是可以扩展HTML元素ÿ…...
Redis(01)| 数据结构
这里写自定义目录标题 Redis 速度快的原因除了它是内存数据库,使得所有的操作都在内存上进行之外,还有一个重要因素,它实现的数据结构,使得我们对数据进行增删查改操作时,Redis 能高效的处理。 因此,这次我…...
SpringBoot工程启动时自动创建数据库、数据表
文章目录 一,序二,自动创建数据库1. 数据源配置2. 修改支持数据库创建 三,自动创建数据库表以及数据1. 准备DDL、DML语句1.)典型DDL语句2.)典型DML语句 2. 设置初始化参数 四、源码传送 一,序 针对Java工程…...
Uni-app智慧工地可视化信息平台源码
智慧工地的核心是数字化,它通过传感器、监控设备、智能终端等技术手段,实现对工地各个环节的实时数据采集和传输,如环境温度、湿度、噪音等数据信息,将数据汇集到云端进行处理和分析,生成各种报表、图表和预警信息&…...
计算机网络重点概念整理-第五章 传输层【期末复习|考研复习】
第五章 传输层 【期末复习|考研复习】 计算机网络系列文章传送门: 第一章 计算机网络概述 第二章 物理层 第三章 数据链路层 第四章 网络层 第五章 传输层 第六章 应用层 第七章 网络安全 计算机网络整理-简称&缩写 文章目录 第五章 传输层 【期末复习|考研复习…...
Java毕业设计 SpringBoot 新能源充电桩管理系统
Java毕业设计 SpringBoot 新能源充电桩管理系统 SpringBoot 新能源充电桩管理系统 功能介绍 管理员 登录 验证码 注册 系统用户管理 普通用户管理 通知公告管理 留言管理 充电站管理 充电桩管理 充电桩预约 充电管理 订单管理 修改密码 普通用户 登录 修改个人资料 通知公告…...
JNI接口
NewStringUTF和NewString接口测试 打开输入法“显示表情与符号” 右键,拷贝字符简介 🍌 香蕉 Unicode: U1F34C,UTF-8: F0 9F 8D 8C unicode码 🍌 \U0001f34c utf-8编码为0xf09f8d8c,结合char或char8_t的长度&…...
国内好用的免费ai软件
国内就只推荐几个大厂,基本感受都差不多 百度文心一言 百度研发的知识增强大语言模型,能够与人对话互动,回答问题,协助创作,高效便捷地帮助人们获取信息、知识和灵感。 地址:文心一言 (baidu.com) 阿里通…...
MAC缓解WebUI提示词反推
当前环境信息: 在mac上安装好stable diffusion后,能做图片生成了之后,遇到一些图片需要做提示词反推,这个时候需要下载一个插件,参考: https://gitcode.net/ranting8323/stable-diffusion-webui-wd14-tagg…...
深入解析JLink与SWD接口:从引脚定义到实际调试应用
1. JLink调试器基础认知 第一次接触JLink时,我完全被那排密密麻麻的20针接口吓到了。这玩意儿真的比USB转串口工具复杂十倍不止!但用熟之后才发现,它其实是嵌入式开发的"瑞士军刀"。简单来说,JLink是SEGGER公司推出的专…...
如何高效完成SVN到Git的无缝迁移:svn2git终极实战指南
如何高效完成SVN到Git的无缝迁移:svn2git终极实战指南 【免费下载链接】svn2git 项目地址: https://gitcode.com/gh_mirrors/sv/svn2git 如果你正在考虑将版本控制系统从SVN迁移到Git,那么svn2git工具将是你的最佳选择。这款专业的Ruby工具能够智…...
从“马斯克算法”中学到的 5 个硬核生存准则,如何颠覆平庸的终极护城河
你以为靠类比就能成功?其实马斯克的5条物理算法才是颠覆平庸的终极护城河作为一名深耕代码、产品迭代和系统架构的开发者,我曾经也深陷大多数人的陷阱:面对新需求,第一反应就是翻竞品案例、套行业模板,然后埋头优化流程…...
3步解锁音乐收藏新维度:从音质到视觉的全方位升级
3步解锁音乐收藏新维度:从音质到视觉的全方位升级 【免费下载链接】Netease_url 网易云无损解析 项目地址: https://gitcode.com/gh_mirrors/ne/Netease_url 在数字音乐收藏领域,我们常常面临三重困境:想听无损音质却受限于平台限制&a…...
mmdetection2.11.0实战:如何用VOC和COCO数据集精准计算每个类别的mAP(附避坑指南)
mmdetection2.11.0实战:VOC与COCO数据集mAP计算全解析与避坑指南 在目标检测领域,mAP(mean Average Precision)是衡量模型性能的核心指标。但不同数据集(如VOC和COCO)的评估标准差异,常常让研究…...
mPLUG-Owl3-2B Streamlit交互指南:支持拖拽上传、缩略图预览、错误堆栈定位
mPLUG-Owl3-2B Streamlit交互指南:支持拖拽上传、缩略图预览、错误堆栈定位 🦉 多模态AI本地化交互新体验 基于mPLUG-Owl3-2B多模态模型开发的本地图文交互工具,针对模型原生调用的各类报错做了全面修复,适配消费级GPU轻量化推理。…...
这是什么编码 - writeup by AI
这是什么编码 - writeup by AI 📋 题目信息项目内容题目名称这是什么编码来源平台BUGKU CTF题目类型Crypto (密码学)核心考点Base 家族编码识别、多层嵌套解码涉及编码Hex、Base32、Base64 🎯 题目描述 给定的密文文件 encode.txt 中包含一串经过多重编码…...
如何快速解锁网易云NCM加密音乐:ncmdump完整实战指南
如何快速解锁网易云NCM加密音乐:ncmdump完整实战指南 【免费下载链接】ncmdump 项目地址: https://gitcode.com/gh_mirrors/ncmd/ncmdump 你是否曾经下载了网易云音乐却发现那些.ncm格式的音乐文件只能在特定软件中播放?ncmdump就是你的数字音乐…...
OpenHarmony-XTS认证实战:从环境准备到报告提交的避坑指南
1. OpenHarmony-XTS认证入门指南 第一次接触OpenHarmony-XTS认证的开发者,往往会被复杂的流程和陌生的术语搞得晕头转向。作为一个踩过无数坑的老手,我完全理解这种迷茫感。记得我第一次做认证时,光是理解各种测试套件的用途就花了整整两天时…...
7维度解析:专业设计师的开源字体解决方案
7维度解析:专业设计师的开源字体解决方案 【免费下载链接】source-han-serif-ttf Source Han Serif TTF 项目地址: https://gitcode.com/gh_mirrors/so/source-han-serif-ttf 如何评估一款开源中文字体的技术价值? 在数字设计领域,字…...
