小程序代码构成

我们在创建一个小程序的时候，大致的目录结构如下：

目录结构

我们会发现有这四种后缀的文件： .json .wxml .wxss .js, 这篇文章主要就是介绍一下这四种文件的作用

json

说明: 小程序的 json 文件是不可以写注释, 否则会报错

  • 我们只需要在 app.json 文件的 "pages" 数组中写出对应的文件路径, 这边给出的是 "pages/test/test", 此时小程序会自动在文件 pages 目录下面生成 test 文件, 在 test 目录下, 也会自动生成展示的四种后缀的文件
生成test文件

app.json 文件重要字段说明:

  • pages -- 描述当前小程序所有页面路径, 方便用户了解当前小程序页面是在哪个目录下面
  • window -- 定义小程序所有页面的顶部背景颜色, 文字颜色定义等

具体文件下面的 json 文件

  • 进行小程序当前页面的相关配置

wxml

相当于 HTML 文件, 但也存在一定的区别

  • 标签名字有区别
    小程序中的标签 view button text 等都是封装好的, 就像平时开发项目中将常用的功能封装成一个组件
  • 多了一些 wx:if 这样的属性及 {{ }} 这样的表达式

wxss

相当于 css 文件, 小程序有适当的扩充和修改

  • 尺寸单位
    正常在开发中, 我们可以以 iPhone6 作为参考


  • 全局样式 app.wxss
  • wxss 仅支持部分 css 选择器

js

逻辑交互

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容