小程序入门浅析

从0到1开发小程序

• 服务器
  • https
  • 验证 ： 微信有文档
  • 模板
  • 推送
• 微信开发角色
  • 管理者
  • 开发者
  • 体验者
• 数据
  • 事件分析

开发工具

• 设置
  • ES6 - ES5：打开
  • 上传：打开
  • 代码压缩：需要做
  • 是否实时刷新页面：是
  • 是否验证https有效性
• 调试（console log）
  • 和谷歌的通知台基本一样
• Source
• Storage
  • 本地缓存
• AppData（小程序的数据层80%是基于data此处理数据）
  • 调试data可以据此调试，特别好用
  • 可以看测试数据

文件结构

目录结构

• icons
• images
• pages
• utils

文件类型

• app.js
• app.json
• app.wxss

延伸

• pc m 小程序 都用 vue.js开发，统一逻辑。

小程序的css js浅析

wxml

• view
• text(长按复制)

wxss

• 基本和原生css语法差不多

技巧性的东西

• if else ：数据不变

• hidden ：动态数据

• for循环

  • wx key index=>item

• 没有成熟的监听事件变化的机制

  • 本地缓存+标记

• css

  • 单位：px
  • display：flex
  • 动画
  • canvas
  • background：只能用base64和远程链接
  • base64处理之前必须要压缩

• js

  • var that = this 异步处理
  • 循环： foreach map
  • 转发/分享
  • 回到首页：通过传参的方式去做

其他细节

• 用户授权
• 地理位置 拒绝的处理
• 本地缓存：封装到utils
• utils：
  • 缓存时间
  • 小程序添加缓存
  • 服务端缓存