Yanxi.me 热爱互联网和技术,喜欢探索的终身学习者

微信小程序技术调研

  阎曦    

这两天抽空看了下微信小程序的官方文档,做笔记如下:

  • 只有先有小程序邀请码,才能试用和体验
  • 开发工具:微信自己的开发工具
  • 并非运行在 Web View 中,体验接近本地应用
  • 全局配置
    • app.js 程序脚本入口
    • app.json 全局配置文件,配置小程序里面的页面
    • app.wxss 全局样式表文件
  • 页面
    • xxx.js 页面的入口文件 (逻辑层)
    • xxx.json 页面配置文件
    • xxx.wxml 页面结构 (View) 支持:数据绑定、条件、列表、模板、事件、引用
    • xxx.wxss 样式表文件 (View)
  • 可以设置 状态栏、导航条、标题、窗口背景色

  • 逻辑层 (App Service)

    • 每个页面有独立作用域、支持模块化
    • 并非运行在浏览器中,不是 Web View
    • 一个程序最后会打包成一个 javascript,启动小程序的时候会运行
  • 生命周期
    • 当用户点击左上角关闭,或者按了设备 Home 键离开微信,小程序并没有直接销毁,而是进入了后台;当再次进入微信或再次打开小程序,又会从后台进入前台。
    • 只有当小程序进入后台一定时间,或者系统资源占用过高,才会被真正的销毁。
  • 组件
    • 视图组件:view, scroll-view, swiper
    • 基础内容:icon, text, progress
    • 表单:button, form, input, checkbox, radio, picker, slider, switch, label
    • 操作反馈:上拉菜单,模式弹框,toast, loading
    • 导航:navigator 导航栏
    • 多媒体:音频、图片、视频
    • 地图 map
    • 画布 canvas
  • API 功能
    • 网络:API请求(可跨域)、上传、下载
    • 媒体:相册、拍照、图片预览、录音、音频和音乐播放控制、保存文件
    • 数据:设置、获取本地缓
    • 位置:存获取当前位置、打开内置地图
    • 设备:获取网络类型、系统类型、重力感应、罗盘数据
    • 界面:设置页面标题、导航条加载动画、前进、后退、动画、绘画、隐藏键盘
    • 开放:微信登录、获取用户信息、微信支付
    • 推送:模板消息推送(只能是提醒和通知,不能涉及营销信息)