微信小程序随笔

1. 整个小程序框架系统分为两部分：逻辑层(App Service)和视图层(View)。

2. 小程序的运行环境分为 渲染层 和 逻辑层 ，其中wxml模板和wxss样式工作再渲染层，js脚本工作在逻辑层。

3. 小程序里没有DOM BOM

全局App.js

绑定生命周期回调函数，错误监听和页面不存在监听函数

1. app.js 小程序 全局逻辑
   生命周期回调函数：小程序从创建到消失，整个过程 产生的一些 函数
   onLaunch：监听小程序初始化，只执行一次
   onShow: 监听小程序启动或者切后台
   onHide: 切换后台触发事件
   全局变量：globalData --> 每一个页面共享的值—> 页面使用 getApp()方法调用全局app

页面index.js

包含data页面的初始数据 生命周期函数 页面相关事件处理函数 自定义事件

1. data : 存储页面数据的容器
2. onLoad : 页面创建时执行
3. onShow : 页面出现在前台时执行
4. onReady : 页面首次渲染完毕时执行
5. onHide : 页面从前台变为后台时执行
6. onPullDownRefresh : 触发下拉刷新时执行
7. onReachBottom : 页面触底时执行
8. onPageScroll : 页面滚动时执行
9. onResize : 页面尺寸变化时执行

js文件想要访问js文件

把模块暴露出去，然后用 require 引入

1. module.exports = fun;
2. module.exports.demo = fun;
   module.exports = {demo:fun} -->其实就是将变量fun名字换 成demo
   module.exports = {
   demo:fun,
   obj:obj
   }

组件

scroll-view组件—可滚动视图区域

1. scroll-view下面包含 横向滚动区域

2. 需要配置样式：一行显示， 不换行， 溢出隐藏

3. 里边包含的组件必须是行内块

进度条：progress组件

图表：icon组件

表单组件：
button->很强大—>open-type属性也很强大
input->没有边框
switch->开关

媒体组件：
image->图片组件，小程序底层已经设置大小，所以使用图片必须设置大小

导航组件：
navigator组件–>
open-type属性-跳转方式

1. navigate：默认跳转方式，保留当前页面，跳转到应用内 的某个页面，可以返回上一页，但是不能跳转到tabber页 面
2. redirect:关闭当前页面，跳转到应用内的某个页面，可以 返回首页，但是不允许跳到tabber页面
3. switchTab:跳转到tabber页面，并关闭其他所有非tabber 页面
4. reLaunch:关闭所有页面，打开到应用内的某个页面
5. navigateBack:关闭当前页面，返回上一页

数据绑定

1. 双大括号绑定数据 内容 {{变量}}
2. 数据绑定语法可以写在属性里面 属性
   特殊：cheackbox组件的checked='true’或’false’不管用；解决办法：,给一个变量，用变量控制true或false

列表渲染

1. wx:for=’{{数组名}}’ wx:key=‘index’ index下标 item数 组遍历的每一项值

2. 当出现数组循环嵌套时，需要修改 item 和 index,使用语法： wx:for-item=‘新’ wx:for-index=‘新’