小程序开发 Wepy 框架 使用规范

1、安装 Node.js

Node官网 https://nodejs.org/en/
中文网 http://nodejs.cn/download/


如果是真实项目，安装LTS版本比较好

也可以用nvm进行管理安装

2、快速入门

安装 wepy 命令行工具 （若有安装，会自动更新）。

npm install wepy-cli -g

wepy -v
# 查看wepy版本

在开发目录生成开发DEMO。

# 1.7.0 版本以下的用
wepy new demo

# 1.7.0之后的版本使用
wepy init standard myproject  初始化项目

# 使用 wepy list 查看项目模板

切换至项目目录

cd myproject

开发实时编译。

wepy build --watch

开发使用说明

使用

微信开发者工具

新建项目，本地开发选择

dist

目录。

微信开发者工具

--> 项目 --> 关闭ES6转ES5。

本地项目根目录运行

wepy build --watch

，开启实时编译。

代码规范：

变量与方法使用尽量使用驼峰式命名，避免使用

$

开头。
以

$

开头的方法或者属性为框架内建方法或者属性，可以被使用，使用前请[参考API文档]()。

入口，页面，组件的命名后缀为

.wpy

。外链的文件可以是其它后缀。
请参考wpy文件说明

使用ES6语法开发。
框架在ES6下开发，因此也需要使用ES6开发小程序，ES6中有大量的语法糖可以让我们的代码更加简洁高效。

使用Promise （不懂promise请移步廖雪峰的promise教程 ：https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/0014345008539155e93fc16046d4bb7854943814c4f9dc2000 ）
框架默认对小程序提供的API全都进行了 Promise 处理，甚至可以直接使用

async/await

等新特性进行开发。

针对原生API进行优化

对现在API进行promise处理，同时修复一些现有API的缺陷，比如：wx.request并发问题等。
原有代码：

onLoad = function () {
var self = this;
wx.login({
success: function (data) {
wx.getUserInfo({
success: function (userinfo) {
self.setData({userInfo: userinfo});
}
});
}
});
}

基于wepy实现代码：

async onLoad() {
await wx.login();
this.userInfo = await wx.getUserInfo();
}

更新DOM

若在操作时数据时发现dom并没有发生改变，那么则需要执行 $apply 脏数据检查机制。（谨用。不可多处出现，会影响性能）

示例：

this.val = 'apply update val';
this.$apply();

未完。