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

微信小程序设计之页面文件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博客

http://www.lryc.cn/news/211330.html

相关文章:

  • VScode 自定义主题各参数解析
  • Linux进程等待
  • python设计模式笔记1:创建型模式 工厂模式和抽象工厂模式
  • 第五章 I/O管理 一、I/O设备的基本概念和分类
  • vue3动态引入图片(:src)
  • Android-登录注册页面(第三次作业)
  • [论文精读]How Powerful are Graph Neural Networks?
  • Redis实现分布式锁之----超时和失效(非原子性)问题----解决方案
  • Android使用Hilt依赖注入,让人看不懂你代码
  • ZYNQ连载01-ZYNQ介绍
  • 第十节——Vue组件
  • Redis(01)| 数据结构
  • SpringBoot工程启动时自动创建数据库、数据表
  • Uni-app智慧工地可视化信息平台源码
  • 计算机网络重点概念整理-第五章 传输层【期末复习|考研复习】
  • Java毕业设计 SpringBoot 新能源充电桩管理系统
  • JNI接口
  • 国内好用的免费ai软件
  • MAC缓解WebUI提示词反推
  • 【设计模式之原型模式 】– C++
  • Flask路由机制分析之二
  • vue中如何获取当时时间时分秒
  • matlab simulink 直线一级倒立摆控制(自起摆和稳态控制)
  • Transformers实战(二)快速入门文本相似度、检索式对话机器人
  • 【错误解决方案】ModuleNotFoundError: No module named ‘PeptideBuilder‘
  • 汇编学习(1)
  • C#,数值计算——分类与推理Svmlinkernel的计算方法与源程序
  • 【鸿蒙软件开发】ArkTS容器组件之Badge
  • H5游戏源码分享-命悬一线
  • 【电路笔记】-交流电阻和阻抗