wepy 小程序開發（Mixin混合）

默認式混合

對於組件data數據，components組件，events事件以及其它自定義方法採用默認式混合，即若是組件未聲明該數據，組件，事件，自定義方法等，那麼將混合對象中的選項將注入組件之中。對於組件已聲明的選項將不受影響。

// mixins/test.js
import wepy from 'wepy';

export default class TestMixin extends wepy.mixin {
    data = {
        foo: 'foo defined by page',
        bar: 'bar defined by testMix'
    };
    methods = {
    tap () {
      console.log('mix tap');
    }
  }
}

// pages/index.wpy
import wepy from 'wepy';
import TestMixin from './mixins/test';

export default class Index extends wepy.page {
    data = {
        foo: 'foo defined by index'
    };
    mixins = [TestMixin ];
    onShow() {
        console.log(this.foo); // foo defined by index
        console.log(this.bar); // bar defined by testMix
    }
}

兼容式混合

對於組件methods響應事件，以及小程序頁面事件將採用兼容式混合，即先響應組件自己響應事件，而後再響應混合對象中響應事件。

注意，這裏事件的執行順序跟Vue中相反，Vue中是先執行mixin中的函數， 再執行組件自己的函數。

// mixins/test.js
import wepy from 'wepy';

export default class TestMixin extends wepy.mixin {
    methods = {
        tap () {
            console.log('mixin tap');
        }
    };
    onShow() {
        console.log('mixin onshow');
    }
}

// pages/index.wpy
import wepy from 'wepy';
import TestMixin from './mixins/test';

export default class Index extends wepy.page {

    mixins = [TestMixin];
    methods = {
        tap () {
            console.log('index tap');
        }
    };
    onShow() {
        console.log('index onshow');
    }
}

// index onshow
// mixin onshow
// ----- when tap
// index tap
// mixin tap