微信小程序学习笔记(一)
微信小程序,在之前的一次比赛的备赛中曾学习过一段时间,后来因为投资方撤资,不了了之,但是还是收获了一点语法知识。现在再学习一遍,便有了更深的印象。
从组成来看小程序整体由三大部分组成,分别为配置部分,逻辑部分,视图部分,配置部分就是json文件,逻辑部分就是js与wxs文件,视图部分由wxml与wxss来构成。
从层次的角度来看,小程序可以分为两层的关系,分别为代表小程序整体的对象app,与小程序中每个页面的对象page。
工作原理:简单的来看,每个小程序被打开时,先将这个app下载到了本地上,然后读取了app.json文件中的配置信息,再按照js中的信息生成了app对象,接着按照app.json中的第一个页面路径打开一个新的页面。新的页面也是先加载了page.json这个配置文件,然后按照page.js中的信息生成了这个页面的对象。最后结合页面对象中的数据,json的配置信息,wxss的样式将page.wxml填充之后,用户就可以看到小程序的第一个页面。
每个页面的数据集合都是一个对象,所以相对与每个页面,都有它在不同的情况下处理数据的对策,也就是生命周期函数,比如说onload()方法内对应的就是页面在加载时要进行的数据操作,onshow()就是页面被显示的时候,会进行的操作。
具体的见下表
属性 | 类型 | 描述 |
---|---|---|
data | Object | 页面的初始数据 |
onLoad | Function | 生命周期函数--监听页面加载 |
onReady | Function | 生命周期函数--监听页面初次渲染完成 |
onShow | Function | 生命周期函数--监听页面显示 |
onHide | Function | 生命周期函数--监听页面隐藏 |
onUnload | Function | 生命周期函数--监听页面卸载 |
onPullDownRefresh | Function | 页面相关事件处理函数--监听用户下拉动作 |
onReachBottom | Function | 页面上拉触底事件的处理函数 |
onShareAppMessage | Function | 用户点击右上角转发 |
onPageScroll | Function | 页面滚动触发事件的处理函数 |
onTabItemTap | Function | 当前是 tab 页时,点击 tab 时触发 |
其他 | Any | 开发者可以添加任意的函数或数据到 object 参数中,在页面的函数中用 this |
除了这些所谓的生命周期函数,开发者还可以定义一些自己的变量或者方法来处理数据。
App.js中主要有这个app()方法
在app对象被创建时,就会调用这个方法,也可以理解为app()方法中的object对象即为app的对象。
page.js同上
在除app()与page()以外,可以调用getApp(),获取app对象的实例
也可以调用getCourrentPages()获取一个数组,数组内时所有页面栈内的页面对象。
- [微信小程序]学习笔记
- 微信小程序学习笔记 (小程序页面学习 十 WXML-事件 基本食用方法)
- 微信小程序,学习笔记(一)框架,视图层
- 微信小程序学习笔记(一)
- 【微信小程序】学习笔记 demo 第一个程序
- 微信小程序学习笔记(九)button
- 微信小程序学习笔记(9)--------API
- 微信小程序学习笔记(十五)switch开关选择器
- 【微信小程序学习笔记】弹窗的两种姿势
- 微信小程序,学习笔记(一)框架,视图层
- 微信小程序学习笔记 (小程序页面学习 五 WXML-数据绑定 基本食用方法)
- 小程序自学笔记(零基础学小程序汇总)---史上最全的微信小程序学习笔记,笔记看我你也就学会小程序了
- 微信小程序学习笔记(2)----HelloWorld分析
- 【微信小程序学习笔记02理解与初始准备】【实战天气微信小程序】
- 微信小程序学习笔记(七)模块化
- 微信:小程序学习笔记(4)
- 微信小程序学习笔记
- 微信小程序学习笔记1——开发环境搭建
- 微信小程序学习笔记(完)
- 微信小程序学习笔记(1)--------准备工作