ts-miniapp

Wechat miniapp demo with typescript (mp-mixin dev env)

Stars
4

mp-mixin demo

mp-mixin

English | | / | Gitee


1.

  1. mixin datamethodsPage
  2. Page Component store
  3. mixin store
  4. typescript
  5. QQ api
  6. 1.83kb

2.

2.1 npm

npm i mp-mixin
import 'mp-mixin';

2.2 cdn

cdn import

cdn: https://cdn.jsdelivr.net/npm/mp-mixin/mp-mixin.min.js

2.3

2.3.1 mixin

mixin

const store = wx.creteStore({});

const mixin = {
    data: {}, // 
    methods: {}, // 
    store: store, //  storejson   store
    // Page
    //  
    onLoad(){

    },
    onShareAppMessage(){

    },

    // Component
    lifetimes:{
        //  
    },
    pageLifetimes:{
        // 
    }
}

Page

Component

2.3.2 mixin

mixin, app.js

import 'mp-mixin';
wx.mixin(mixin); // mixin   2.3.1

2.3.3 Page mixin

Page mixin

Page({
    mixin: mixin, // mixin   2.3.1
    // ...
})

2.3.4 Component mixin

Component mixin

Component({
    mixin: mixin, // mixin   2.3.1
    // ...
})
  • mixin > mixin

  • data store
  • mixin data PagedatasetData
  • mixin storePagedataPagesetData UI

3 api

mp-mixin mp-mixin api wx

wx.mixin
wx.createStore
wx.initGlobalStore

wx.initGlobalStore wx.mixin store

wx.initGlobalStore({
    // state
})

wx.mixin({
    store: {
        // state
    }
})

API

import {globalMixin, createStore, initGlobalStore} from 'mp-mixin'
// ...

injectStaff

import {injectStaff} from 'mp-mixin'
injectStaff(anyObject);

mp-mixin version

wx.mpMixinVersion

// 

import {version} from 'mp-mixin';

4.

  1. type.d.ts
  2. index.d.ts