微信小程序开发详解 1 : 初始小程序 2 :开发框架配置和逻辑层

1.1 小程序是什么

     小程序的优点

使用方便:无须下载,打开即用,用完即走。

  • 开发简单:小程序开发过程的本质是在MVVM风格的JavaScript框架上开发,有前端经验的程序员可以无缝衔接,无经验的“小白”也可以快速入门。
  • 跨平台运行:不用再分别开发iOS和Android版本,只需发布到微信小程序平台,所有平台都可用。
  • 快速分发与迭代:无须关心各种发布渠道,也无须担心旧版本升级和兼容问题。

     小程序的开发能力:微信以框架、组件和API的形式开放了如下服务和支撑能力。

  • 视图容器:视图容器、可滚动视图容器、滑块视图容器。
  • 基础内容:图标、文本、进度条
  • 表单组件:按钮、表单、输入框、多项选择器、单项选择器、列表选择器、内嵌列表选择器、滚动选择器、开关选择器、标签等。
  • 操作反馈:底部菜单、模态弹窗、消息提示框、加载提示符。
  • 导航:页面跳转和应用链接
  • 媒体组件:音频、图片、视频
  • 地图:地图map。
  • 画布:画布canvas。
  • 客服会话:进入客服会话按钮。
  • 文件操作:保存文件到本地、获取本地已保存的文件列表、获取本地文件的文件信息、删除本地存储的文件、打开(预览)文档。
  • 网络:发起请求、上传、下载、WebSocket。
  • 媒体:图片、录音、音频、视频
  • 文件:保存文件、删除文件、打开文档。
  • 数据缓存:存储数据、读取数据、删除数据、清除数据。
  • 位置:获取位置、查看位置、地图组件控制。
  • 设备:系统信息、网络状态、重力感应、罗盘、拨打电话、扫码。
  • 界面:交互反馈、设置导航条、导航、动画、绘图、下拉刷新。
  • 开放接口:登录、用户信息、微信支付、模板消息、客服消息、分享、获取二维码。

     小程序的前景

1.2 开发文档与开发工具


第2章 开发框架配置和逻辑层

2.1 开发框架简介

   有个非正式的名称MINA

   与HTML5的区别和联系


     HTML5在加载时受限于网络环境,需要顺序加载HTML、CSS、JS,然后返回数据,最后渲染页面,并显示在浏览器中。用户经常需要等待很长时间,体验会受影响。

     相比之下,小程序的两个线程---Appservice Thread和View Thread会同时进行、并行加载,甚至Appservice Thread会更早执行。当视图线程加载完通知Appservice时,Appservice会把准备好的数据用setData的方法返回给视图线程。 

     这种优化策略可以减少用户的等待时间,加快小程序的响应速度。

     小程序由5个部分组成

  1. App:指小程序整个项目。
  2. window:用于设置小程序的状态栏、导航栏、标题、窗口背景色。
  3. 页面:一个App包含若干页面。微信规定,同时打开的页面最多不超过5个。
  4. 组件:框架为开发者提供了一系列基础组件,开发者可以通过组合这些基础组件进行快速开发。这些组件是构成页面的基本元素。
  5. 路由:不同页面之间的跳转称为路由。


         生命周期:3个阶段

  1. App启动阶段:主要加载小程序window配置,注册程序和页面;
  2. Page启动阶段:完成页面资源加载、页面渲染、页面挂载
  3. 销毁阶段:完成页面隐藏、卸载和销毁。

2.2 注册程序与页面

    一个App包含若干页面。小程序启动时,首先进入注册程序过程,可以指定小程序的生命周期函数等。用户在App的不同页面之间跳转时,小程序进入注册页面过程,可以指定页面的初始数据、生命周期函数、事件处理函数等。

    注册程序:在App.js文件里,用App()函数注册一个小程序。主要有4个监听函数:

  1. onLaunch监听小程序初始化。全局只触发一次
  2. onShow监听小程序显示:启动或从后台进入前台显示时触发
  3. onHide监听小程序隐藏:从前台进入后台
  4. onError为错误监听:发生脚本错误或API调用失败时触发

    注册页面:Page()函数负责页面加载、切换、路由,接收一个object对象,指定页面的初始数据、生命周期函数、事件处理函数等。

object对象:


     页面的路由:由框架进行管理。


2.3 项目架构

   pages文件夹用于放置页面文件

   app.js是App的启动脚本,可以处理一些App启动过程中页面加载之前要处理的事情。

   app.json是App的配置文件,配置项包括window、页面、tab菜单栏等。

   app.wxss是App的公共样式,类似于css


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值