微信小程序开发

flex布局

1) Flex 是 Flexible Box 的缩写,意为”弹性布局”,用来为盒状模型提供最大的灵活性。
2) 任何一个容器都可以指定为 Flex 布局。
3) display: ‘flex’

 flex 属性

1) flex-direction:
row(默认值):主轴为水平方向,起点在左端。
row-reverse:主轴为水平方向,起点在右端。
column:主轴为垂直方向,起点在上沿。
column-reverse:主轴为垂直方向,起点在下沿。

移动端相关知识

物理像素
1) 屏幕的分辨率
2) 设备能控制显示的最小单元,可以把物理像素看成是对应的像素点

设备独立像素 & css 像素

设备独立像素(也叫密度无关像素),可以认为是计算机坐标系统中的一个点,这个点代
表一个可以由程序使用并控制的虚拟像素(比如:CSS 像素,只是在 android 机中 CSS 像素就
不叫”CSS 像素”了而是叫”设备独立像素”),然后由相关系统转换为物理像素。

小程序框架接口

App
1. 全局 app.js 中执行 App()
2. 生成当前应用的实例对象
3. getApp()获取全局应用实例

Page
1. 页面.js 中执行 Page()
2. 生成当前页面的实例
3. 通过 getCurrentPages 获取页面实例

wxml 语法

初始化数据
1. 页面.js 的 data 选项中

 使用数据
1. 模板结构中使用双大括号 {{message}}

修改数据
1. this.setData({message: ‘修改之后的数据’}, callback)
2. 特点:
a) 同步修改: this.data 值被同步修改
b) 异步更新: 异步将 setData 函数用于将数据从逻辑层发送到视图层(异步)

 事件绑定

1. bind 绑定:事件绑定不会阻止冒泡事件向上冒泡

2. catch 绑定: 事件绑定可以阻止冒泡事件向上冒泡

列表渲染
语法说明
1. wx:for=’{{arr}}’
2. wx:key=’{{唯一值}}’
注意事项
1. 默认的个体: item
2. 默认的下标: index
3. 自定义个体变量名称: wx:for-item=’myItem’
4. 自定义下标变量名称: wx:for-index=’myIndex’

数据绑定

1.data中初始化数据

2.修改数据:this.setData()

        1.修改数据的行为始终是同步的

3.数据流

        1.单项:Model-->View

路由跳转

路由跳转需要用到API,可在微信官方文档查询 

url:+页面路径 

wx.redirectTo:关闭当前页面跳转到目的页面(左上角按钮回到主页面)

wx.reLaunch:关闭所有页面跳转到目的页面(左上角按钮回到主页面)

生命周期函数

onload(请求一次)

onshow(请求多次)考虑清楚可能影响性能

onready(全部加载玩后可调用请求)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值