一、小程序项目结构
app.json文件作用:全局配置、组装,可用于添加页面,bar样式、颜色、字体、背景
页面组成:js逻辑、wxml结构、wxss样式、json配置
二、小程序异步机制
假如有三行代码,第二行很费时间。同步就是按照1,2,3的顺序执行,异步就是执行到2的时候直接执行3,将2交给其他线程来办,其他线程通过回调函数告诉主线程。
三、数据绑定
1.作用:把数据和页面合并
2.意义:只需修改变量,页面就自动更新,减少了很多操作
3.单向数据绑定:修改变量可以改变页面,修改页面不能改变量
4.双向数据绑定:修改变量可以改变页面,修改页面可以改变量
四、视频播放
使用了<video>组件,url设置视频地址。
五、页面生命周期
onLoad:加载成功
onShow:显示前
onReady:首次渲染成功
onHide:页面被遮挡
onUnload:销毁
六、概念
1.什么是小程序:
基于微信的轻量级不下载、用完即走的应用
2.开发步骤:
注册账号、创建小程序、下载开发工具、编码、调试、测试、提交审核、上线发布
3.调试、测试:
种类分为真机调试和虚拟机调试
提供了单步调试、控制台输出、变量监测
七、常用API
wx.getUserInfo得到用户信息
wx.request网络请求
wx.getLocation获得地址信息
wx.setStorageSync保存缓存
wx.getStorageSync取缓存
八、常用标签
<text>文本
<view>块元素
<image>图片
<button>按钮
<input>文本输入
<picker>滚动组件
<video>视频
<canvas>画布
九、事件
事件是组件发出的通知程序的接口
bindtap:手指触摸后马上离开,类似于HTML中的click
bindchange:状态改变时触发
bindinput:文本框的输入事件
function(e){ //e是事件
target:目标(发起者)(按钮,输入框)
detail:事件参数
}
十、条件渲染、列表渲染
条件渲染:wx:if wx:elif wx:else
列表渲染:wx:for wx:key是下标
wx:if="x"
wx:for="x"
上面的代码出现在.wxml中
Page({
data:{
x:[ ........ ]
}
})
而wx:for的内容(x)出现在.js中,(x)是一个数组
十一、本地文件存取
wx.safeFile()保存文件
wx.openDocument()新开页面打开文档
十二、CSS流式布局
display:flex
flex-direction:row水平
flex-direction:colomn垂直
十三、画布
lineTo:移动到这个坐标,并给走过的路径画上线
moveTo:移动到这个坐标,走过的路径不画线
十四、路由与跳转
路由是在同一个小程序中从一个页面到另一个页面
跳转是一个小程序到另一个小程序
十五、其他
json是对象序列化后的一种形式
image中的mode="widthFix"是图片可能放不下,要缩放图片,宽度固定,按比例设置高度
标签:flex,复习,渲染,微信,程序,期末,wx,调试,页面 From: https://blog.csdn.net/weixin_63461613/article/details/137378087