微信小程序&django

小程序的文件类型

• .wxml （结构，类似于html） 标签名字：由HTML（<div>、<p>、<span>...）改为===》 微信小程序的WXML(<view>)
• wx:if 、wx:for、{ {}}

.wxss (表现，类似于css)

• 具备CSS的大部分属性

• 新增尺寸单位

• 全局样式和局部样式

.js (行为)

• 原生js语言

.json (配置)

• 工具配置—project.config.json

• 项目配置—app.json

• 页面配置—.json

目录解释:

• pages目录—页面相关的代码 （新建小程序项目，自动生成默认有的）
• utils目录—工具相关代码（网络请求、文件操作等） （新建小程序项目，自动生成默认有的）
• 其他文件—thirdparty(第三方代码)、conponents(小程序组件代码)、resources(存放小程序资源，图标图片等等)

小程序的全局入口、配置与样式

• 全局入口—app.js
• 全局配置—app.json
• 全局样式—app.wxss

小程序的配置

• 全局配置 — app.json
• 页面配置 — .json
  小程序的全局配置
• pages列表配置
• window属性配置
• abbar配置（底部菜单栏）

小程序的页面配置

• 只能配置全局配置中的window配置项内容
• 会覆盖全局配置中的window配置 开启下拉刷新
• 在.json写入如图所示，即可下拉触发刷新
  
  小程序的逻辑层
• 小程序注册逻辑
• 页面注册逻辑

小程序注册逻辑

App函数:
注册全局唯一的小程序
只能调用一次
接受一个对象作为函数参数，这个对象指定了两个东西（第一个东西是小程序的全局数据，第二个东西是小程序的生命周期回调函数）

页面注册逻辑

Page函数:

• 注册一个页面
• 接受一个对象作为函数参数，这个对象指定了两个东西（第一个东西是页面数据，第二个东西是页面的生命周期回调函数）

页面数据:

• data属性

data:{
   
    message: "hello world",
}

访问： this.data.message
修改：this.setData({})

• 使用全局数据

获取全局唯一的App实例 const app = getApp()
通过唯一实例获取全局数据 var data = app.globalData

页面的生命周期回调(比较难理解)
看页面生命周期时序图，配合理解

小程序的视图层 xxx.wxml

• 数据绑定
• 列表渲染
• 条件渲染
• 绑定事件

数据绑定

语法： { { }}

//视图层 例如：index.wxml
<view>{
   {
    message }}</view>

//逻辑层 例如：index.js
Page