微信小程序开发教程-pages页面构成:wxml、wxss、json、js文件解释

介绍

如下图:pages 目录下,每个 子文件夹 表示一个页面,每个文件夹包含:wxml、wxss、json、js 4个文件,这些文件与 子文件夹 同名

解释

微信小程序的页面,类似网页开发,网页开发由:HTML、CSS、JavaScript 构成(类似VUE)

  • .wxml:相当于 HTML 文件
  • .wxss:相当于 CSS 文件
  • .js:等于 JS 文件

以 index 子文件夹为例:

index.wxml

相当于 HTML 文件,写页面标签、数据绑定{{}}、循环wx:for、条件渲染wx:if等视图结构。

index.wxss

相当于 CSS 文件,仅当前页面生效,优先级高于 app.wxss;支持rpx自适应单位、选择器。

index.js

页面逻辑脚本,通过Page({})注册页面,存放当前页面数据data、点击事件、生命周期(onLoad/onReady/onUnload)、接口请求。

index.json

页面独立配置(局部覆盖app.json),单独修改当前页面导航栏标题、颜色、下拉刷新,不影响其他页面;无配置可空{}。


原文出处:/show_1GW3WwjHv36H.html