## API
### wepy.app Class
App 基類，小程序入口。
```javascript
export class App extends wepy.app {
onLaunch () {
}
}
```
**屬性**
* `$wxapp:Object`: `this.$wxapp`等同于`getApp()`。
* `$pages:List<Page>`: 所有頁面列表
格式如下：
```javascript
this.$pages = {
'./pages/index': IndexPage
}
```
* `$interceptors:List<Object>`：所有攔截器列表
格式如下：
```javascript
this.$interceptors = {
'request': {
config (p) {
return p;
},
success (rst) {
}
}
}
```
**方法**
* `use(middleWare:String|Function)`：使用中間件。
當前內置兩個中間件：
* `requestfix`: 修復小程序請求并發問題。
* `promisify`：使用`wepy.xxx`的方式請求小程序原生API都將Promise化。
使用方法如下:
```javascript
this.use('requestfix');
this.use('promisify');
```
* `intercept(api:String, provider:Object)`：使用攔截器對原生API請求進行攔截。
格式如下:
```javascript
// app.js
constructor () {
super();
this.intercept('request', {
config (p) {
p.timestamp = +new Date();
return p;
},
success (obj) {
console.log('request success');
}
});
}
```
### wepy.component Class
組件基類
**屬性**
* `$name:String`: 組件名稱。
* `$isComponent:Boolean`：是否是組件，如果是頁面，此值為false。
* `$wxpage:Object`: 小程序原生page。
* `$parent:Page|App`：組件的父組件，如果當前是組件是Page對象，那么$parent的值為App對象。
* `$root:Page`: 組件所在的Page對象，如果當前組件是Page對象，那么$root的值就是自己本身。
* `$coms:List<Component>`：組件的子組件列表。
* `$mixins:Array[Mixin]`：組件所注入的Mixin對象。
* `data:Object`: 組件需要綁定的數據。
* `methods:List<Function>`：組件需要響應的事件列表。
* `props:List<Props>`：組件允許傳遞的props列表。
* `events:List<Function>`：組件通信時所需要的事件表現。
**方法**
* `setData(key:String|Object, [value:Object])`：對原有小程序的`setData`的封裝。
因為WePY的臟查檢流程會自動執行setData操作，所以通常情況下不需要使用此方法。
使用方法如下:
```javascript
this.setData('list', ['apple', 'pen']);
this.setData({
list: ['apple', 'pen']
});
```
* `getCurrentPages()`：相當于全局方法`getCurrentPages()`。
* `$getComponent(com:String)`：通過組件名稱路徑查找組件對象。
使用方法如下:
```javascript
this.$getComponent('./coma/comb');
this.$getComponent('../comc');
```
* `$invoke(com:String|Component)`：調用另一組件的方法。
優先調用methods中方法，如果方法不存在，則調用組件的自定義方法，調用自定義方法時，不會傳遞事件$event。
使用方法如下:
```javascript
// coma.js
this.$invoke('./ComB', 'func1', 'p1', 'p2');
this.$invoke('./ComB', 'func2', 'p1', 'p2');
// comb.js
export class ComB extends wepy.component {
methods = {
func1 (p1, p2, evt) {}
},
func2 (p1, p2) {}
}
```
* `$broadcast(eventName:String, [args])`：組件發起一個廣播事件。
向所有子組件發起一個廣播事件，事件會依次傳播直至所有子組件遍歷完畢或者事件被手動終止傳播。
使用方法如下:
```javascript
// page1.js
components = { ComA };
this.$broadcast('broadcast-event', 'p1', 'p2');
// coma.js
events = {
'broadcast-event': (p1, p2, event) {}
}
```
* `$emit(eventName:String, [args])`：組件發起一個冒泡事件。
向父組件發起一個冒泡事件，事件會向上冒泡直至Page或者者事件被手動終止傳播。
使用方法如下:
```javascript
// coma.js
this.$emit('emit-event', 'p1', 'p2');
// page1.js
components = { ComA };
events = {
'emit-event': (p1, p2, event) => {}
}
```
* `$apply([func:Function])`：組件發起臟檢查。
正常流程下，改變數據后，組件會在流程結束時自動觸發臟檢查。
在異步或者回調流程中改變數據時，需要手動調用`$apply`方法。
使用方法如下:
```javascript
this.userName = 'Gcaufy';
this.$apply();
this.$apply(() => {
this.userName = 'Gcaufy';
});
```
* `$nextTick([func:Function])`：組件數據綁定完成后的回調事件，v1.6.1以上可用。
數據綁定后的回調事件，在不傳入function時，返回一個promise對象
使用方法如下:
```javascript
this.userName = 'Gcaufy';
this.$nextTick(function () {
console.log('UI updated');
});
```
或者：
```javascript
this.userName = 'Gcaufy';
this.$nextTick().then(function () {
console.log('UI updated');
});
```
### wepy.page Class
頁面類，繼承自`wepy.component`，擁有頁面所有的屬性與方法。
**屬性**
全部屬性繼承自`wepy.component`。
**方法**
* `$preload(key:String|Object, [value:Object])`：給頁面加載preload數據
加載preload數據后，跳轉至另一個頁面時，在onLoad方法中可以獲取到上個頁面的preload數據。
使用方法如下：
```javascript
// page1.js
this.$preload('userName', 'Gcaufy');
this.$redirect('./page2');
// page2.js
onLoad (params, data) {
console.log(data.preload.userName);
}
```
* `$redirect(url:String|Object, [params:Object])`：`wx.redirectTo`的封裝方法。
使用方法如下：
```javascript
this.$redirect('./page2', {a: 1, b: 2});
this.$redirect({
url: './pages?a=1&b=2'
});
```
* `$navigate(url:String|Object, [params:Object])`：`wx.navigateTo`的封裝方法
* `$switch(url:String|Object)`：`wx.switchTab`的封裝方法
### wepy.event Class
小程序事件封裝類
```javascript
new wepy.event(name:String, source:Component, type:String)
```
**屬性**
* `name(String)`: 事件名稱
當事件為小程序原生事件時，如`tap`，`change`等，name值為`system`。
當事件為用戶自定事件或者組件通信事件時，如`$emit`，`$broadcast`等，name值為自定事件的名稱。
* `source(Component)`：事件來源組件
無論是小程序原生事件還是自定事件，都會有對應的事件來源組件。
* `type(String)`: 事件類型
`$emit`事件中，type值為`emit`。`bindtap`事件中，type值為`tap`。
**方法**
* `$destroy()`：終止事件傳播
在`$emit`或者`$broadcast`事件中，調用`$destroy`事件終止事件的傳播。
* `$transfor(wxevent:Object)`：將內部小程序事件的屬性傳遞到當前事件。
### wepy.mixin Class
Mixin基類，用于復用不同組件中的相同功能。
```javascript
// mymixn.js
export class MyMixin extends wepy.mixin {
// my logic here
}
// mycom.js
import MyMixin from './mymixin';
export class MyCom extends wepy.component {
mixins = [MyMixin];
}
```
