属性

    • : this.$wxapp等同于getApp()
    • $pages:List<Page>: 所有页面列表

      格式如下:

      1. this.$pages = {
      2. './pages/index': IndexPage
      3. }
    • $interceptors:List<Object>:所有拦截器列表

      格式如下:

      1. this.$interceptors = {
      2. 'request': {
      3. config (p) {
      4. return p;
      5. },
      6. success (rst) {
      7. }
      8. }
      9. }

      方法

    • use(middleWare:String|Function):使用中间件。

      当前内置两个中间件:

      • requestfix: 修复小程序请求并发问题。
      • promisify:使用wepy.xxx的方式请求小程序原生API都将Promise化。

        使用方法如下:

        1. this.use('requestfix');
        2. this.use('promisify');
    • intercept(api:String, provider:Object):使用拦截器对原生API请求进行拦截。

      格式如下:

      1. // app.js
      2. constructor () {
      3. super();
      4. this.intercept('request', {
      5. config (p) {
      6. p.timestamp = +new Date();
      7. return p;
      8. },
      9. success (obj) {
      10. console.log('request success');
      11. }
      12. });
      13. }

    组件基类

    属性

    • $name:String: 组件名称。
    • $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列表。
    • :组件通信时所需要的事件表现。

    方法

    • setData(key:String|Object, [value:Object]):对原有小程序的setData的封装。

      因为WePY的脏查检流程会自动执行setData操作,所以通常情况下不需要使用此方法。

      使用方法如下:

    • getCurrentPages():相当于全局方法getCurrentPages()

    • 使用方法如下:

      1. this.$getComponent('./coma/comb');
      2. this.$getComponent('../comc');
    • $invoke(com:String|Component):调用另一组件的方法。

      优先调用methods中方法,如果方法不存在,则调用组件的自定义方法,调用自定义方法时,不会传递事件$event。

      使用方法如下:

      1. // coma.js
      2. this.$invoke('./ComB', 'func1', 'p1', 'p2');
      3. this.$invoke('./ComB', 'func2', 'p1', 'p2');
      4. // comb.js
      5. export class ComB extends wepy.component {
      6. methods = {
      7. func1 (p1, p2, evt) {}
      8. },
      9. func2 (p1, p2) {}
      10. }
    • $broadcast(eventName:String, [args]):组件发起一个广播事件。

      向所有子组件发起一个广播事件,事件会依次传播直至所有子组件遍历完毕或者事件被手动终止传播。

      使用方法如下:

      1. // page1.js
      2. components = { ComA };
      3. this.$broadcast('broadcast-event', 'p1', 'p2');
      4. // coma.js
      5. events = {
      6. 'broadcast-event': (p1, p2, event) {}
      7. }
    • $emit(eventName:String, [args]):组件发起一个冒泡事件。

      向父组件发起一个冒泡事件,事件会向上冒泡直至Page或者者事件被手动终止传播。

      使用方法如下:

      1. // coma.js
      2. this.$emit('emit-event', 'p1', 'p2');
      3. // page1.js
      4. components = { ComA };
      5. 'emit-event': (p1, p2, event) => {}
      6. }
    • $apply([func:Function]):组件发起脏检查。

      正常流程下,改变数据后,组件会在流程结束时自动触发脏检查。
      在异步或者回调流程中改变数据时,需要手动调用$apply方法。

      使用方法如下:

    • $nextTick([func:Function]):组件数据绑定完成后的回调事件,v1.6.1以上可用。

    数据绑定后的回调事件,在不传入function时,返回一个promise对象

    使用方法如下:

    1. this.userName = 'Gcaufy';
    2. this.$nextTick(function () {
    3. console.log('UI updated');
    4. });

    或者:

    1. this.userName = 'Gcaufy';
    2. this.$nextTick().then(function () {
    3. console.log('UI updated');

    页面类,继承自wepy.component,拥有页面所有的属性与方法。

    属性

    方法

    • $preload(key:String|Object, [value:Object]):给页面加载preload数据

      加载preload数据后,跳转至另一个页面时,在onLoad方法中可以获取到上个页面的preload数据。

      使用方法如下:

      1. // page1.js
      2. this.$preload('userName', 'Gcaufy');
      3. this.$redirect('./page2');
      4. // page2.js
      5. onLoad (params, data) {
      6. console.log(data.preload.userName);
      7. }
    • $redirect(url:String|Object, [params:Object])wx.redirectTo的封装方法。

      使用方法如下:

      1. this.$redirect('./page2', {a: 1, b: 2});
      2. this.$redirect({
      3. url: './pages?a=1&b=2'
      4. });
    • $navigate(url:String|Object, [params:Object])wx.navigateTo的封装方法

    • $switch(url:String|Object)wx.switchTab的封装方法

    小程序事件封装类

    属性

    • name(String): 事件名称

      当事件为小程序原生事件时,如tapchange等,name值为system
      当事件为用户自定事件或者组件通信事件时,如$emit$broadcast等,name值为自定事件的名称。

    • source(Component):事件来源组件

      无论是小程序原生事件还是自定事件,都会有对应的事件来源组件。

    • type(String): 事件类型

      $emit事件中,type值为emitbindtap事件中,type值为tap

    方法

    • $destroy():终止事件传播

      $emit或者$broadcast事件中,调用$destroy事件终止事件的传播。

    • $transfor(wxevent:Object):将内部小程序事件的属性传递到当前事件。

    1. // mymixn.js
    2. export class MyMixin extends wepy.mixin {
    3. // my logic here
    4. }
    5. // mycom.js
    6. import MyMixin from './mymixin';
    7. export class MyCom extends wepy.component {