小程序简介小程序是一种全新的连接用户与服务的方式，它可以在微信内被便捷地获取和传播，同时具有出色的使用体验。小程序技术发展史小程序并非凭空冒出来的一个概念。当微信中的 WebView 逐渐成为移动 Web 的一个重要入口时，微信就有相关的 JS API 了。代码清单1-1 使用 WeixinJSBridge 预览图片WeixinJSBridge.invoke('imagePreview', { ...

WXSWXS（WeiXin Script）是小程序的一套脚本语言，结合 WXML，可以构建出页面的结构。注意WXS 不依赖于运行时的基础库版本，可以在所有版本的小程序中运行。WXS 与 JavaScript 是不同的语言，有自己的语法，并不和 JavaScript 一致。WXS 的运行环境和其他 JavaScript 代码是隔离的，WXS 中不能调用其他 JavaScript 文件中定义的函数，也 ...

WXSSWXSS (WeiXin Style Sheets)是一套样式语言，用于描述 WXML 的组件样式。WXSS 用来决定 WXML 的组件应该怎么显示。为了适应广大的前端开发者，WXSS 具有 CSS 大部分特性。同时为了更适合开发微信小程序，WXSS 对 CSS 进行了扩充以及修改。与 CSS 相比，WXSS 扩展的特性有：尺寸单位样式导入尺寸单位rpx（responsive pixel） ...

WXMLWXML（WeiXin Markup Language）是框架设计的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。要完整了解 WXML 语法，请参考WXML 语法参考。用以下一些简单的例子来看看 WXML 具有什么能力：数据绑定<!--wxml--> <view> {{message}} </view>// page.js Page({ ...

视图层 View框架的视图层由 WXML 与 WXSS 编写，由组件来进行展示。将逻辑层的数据反应成视图，同时将视图层的事件发送给逻辑层。WXML(WeiXin Markup language) 用于描述页面的结构。WXS(WeiXin Script) 是小程序的一套脚本语言，结合 WXML，可以构建出页面的结构。WXSS(WeiXin Style Sheet) 用于描述页面的样式。组件(Comp ...

API小程序开发框架提供丰富的微信原生 API，可以方便的调起微信提供的能力，如获取用户信息，本地存储，支付功能等。详细介绍请参考 API 文档。通常，在小程序 API 有以下几种类型：事件监听 API我们约定，以 on 开头的 API 用来监听某个事件是否触发，如：wx.onSocketOpen，wx.onCompassChange 等。这类 API 接受一个回调函数作为参数，当事件触发时会调用 ...

微信开发过程中经常出现图片变形，缩放的属性这些图片处理，只要明白了mode属性就都有了例如：用下面代码，图片就可能变形 <image class='sizeModal-img' src='{{imageUrl}}'></image> 用下面的属性，就不变形了 <image class='sizeModal-img' mode='aspectFit' src= ...

mode属性 1,scaleToFill 缩放模式（默认属性）不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素2,aspectFit 缩放模式，保持纵横比缩放图片，使图片的长边能完全显示出来。也就是说，可以完整地将图片显示出来。3,aspectFill 缩放模式，保持纵横比缩放图片，只保证图片的短边能完全显示出来。也就是说，图片通常只在水平或垂直方向是完整的，另一个方向将会发生截 ...

API小程序开发框架提供丰富的微信原生 API，可以方便的调起微信提供的能力，如获取用户信息，本地存储，支付功能等。详细介绍请参考 API 文档。通常，在小程序 API 有以下几种类型：事件监听 API我们约定，以 on 开头的 API 用来监听某个事件是否触发，如：wx.onSocketOpen，wx.onCompassChange 等。这类 API 接受一个回调函数作为参数，当事件触发时会调用 ...

模块化可以将一些公共的代码抽离成为一个单独的 js 文件，作为一个模块。模块只有通过 module.exports 或者 exports 才能对外暴露接口。注意：exports 是 module.exports 的一个引用，因此在模块里边随意更改 exports 的指向会造成未知的错误。所以更推荐开发者采用 module.exports 来暴露模块接口，除非你已经清晰知道这两者的关系。小程序目前不 ...

页面路由在小程序中所有页面的路由全部由框架进行管理。页面栈框架以栈的形式维护了当前的所有页面。 当发生路由切换的时候，页面栈的表现如下：路由方式页面栈表现初始化新页面入栈打开新页面新页面入栈页面重定向当前页面出栈，新页面入栈页面返回页面不断出栈，直到目标返回页Tab 切换页面全部出栈，只留下新的 Tab 页面重加载页面全部出栈，只留下新的页面开发者可以使用 getCurrentPages() 函数 ...

生命周期以下内容你不需要立马完全弄明白，不过以后它会有帮助。下图说明了页面 Page 实例的生命周期。 ...

对于小程序中的每个页面，都需要在页面对应的 js 文件中进行注册，指定页面的初始数据、生命周期回调、事件处理函数等。使用 Page 构造器注册页面简单的页面可以使用 Page() 进行构造。代码示例：//index.js Page({ data: { text: "This is page data." }, onLoad: function(options) { ...

每个小程序都需要在 app.js 中调用 App 方法注册小程序示例，绑定生命周期回调函数、错误监听和页面不存在监听函数等。详细的参数含义和使用请参考 App 参考文档 。// app.js App({ onLaunch (options) { // Do something initial when launch. }, onShow (options) { ...

逻辑层 App Service小程序开发框架的逻辑层使用 JavaScript 引擎为小程序提供开发者 JavaScript 代码的运行环境以及微信小程序的特有功能。逻辑层将数据进行处理后发送给视图层，同时接受视图层的事件反馈。开发者写的所有代码最终将会打包成一份 JavaScript 文件，并在小程序启动的时候运行，直到小程序销毁。这一行为类似 ServiceWorker，所以逻辑层也称之为 A ...