微信小程序的一些笔记,仅作参考
对于小程序,所有的页面都需要在app.json
里的pages
里进行注册
如果要新增一个页面,首先要新增一个文件夹,再创建一个page,一个page会包含四个子页面
新建页面时小程序开发工具会自动在pages
里添加,反之亦然
页面数据不会实时更新,需要使用this.setData()
方法
在页面中获取app实例中的数据,注意,app中的数据不是响应式的,这里共享的数据通常是一些固定的数据
获取button携带的item信息,并跳转
对于图片image,基本设置mode="widthFix"
尺寸单位
- rpx(responsive pixel): 可以根据屏幕宽度进行自适应,规定屏幕宽为750rpx。
- 如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,1rpx = 0.5px = 1物理像素
Mustache语法WXML基本格式:
- 类似于HTML代码:比如可以写成单标签,也可以写成双标签;
- 必须有严格的闭合:没有闭合会导致编译错误
- 大小写敏感:class和Class是不同的属性
- 如果使用原生JS或者jQuery的话, 我们需要通过操作DOM来进行界面的更新
- 小程序和Vue一样, 提供了插值语法: Mustache语法(双大括号)
列表渲染 – wx:for
- 在组件中,我们可以使用wx:for来遍历一个数组 (字符串 - 数字)
- 默认情况下,遍历后在wxml中可以使用一个变量index,保存的是当前遍历数据的下标值。
- 数组中对应某项的数据,使用变量名item获取