@miapp/store

store

数据流管理

使用

具体使用方法参考 Minifish Store，不同点：

• 不支持 module 分模块功能

// store.js
import Store from "@miapp/store";

const store = new Store({
  state: {
    foo: 1,
    bar: 2
  },
  getters: {
    fooBar(state) {
      return state.foo + state.bar
    }
  },
  mutations: {
    update(state, diff) {
      state.foo += diff;
    }
  },
  actions: {
    doUpdate({ commit }, diff) {
      setTimeout(() => {
        commit('update', diff);
      }, 3000);
    }
  },
  plugins: []
});

// page.js
import { createPage } from '@miapp/app';
import store from './store';

createPage({
  $store: store,
  onLoad() {
    console.log(this.data);
    console.log(this.$store);
    this.$store.commit('foo', 'bar');
    this.$store.dispatch({ type: 'foo', bar: 'bar' });
  }
});

import { createComponent } from '@miapp/app';
createComponent({
  connector: {
    state: ['foo', { b: 'bar' }],
    getters: ['fooBar'],
    mutations: ['foo'],
    actions: {
      dispatchBar: 'bar'
    },
  },
  didMount() {
    console.log(this.data.foo);
    console.log(this.data.b); // b => bar
    console.log(this.data.fooBar);

    this.foo(2); // this.$store.commit('foo', 2);
    this.dispatchBar({ diff: 1 }); // this.$store.dispatch('bar', { diff: 1 });
  }
}));

axml 直接使用 state/getters 数据

<view>
  <text>{{foo}}</text>
  <text>{{bar}}</text>
  <text>{{fooBar}}</text>
</view>

开发

1. yarn 或者 ayarn（阿里内网）安装依赖
2. 小程序 IDE 打开组件（下载地址）

更多命令

• miapp newbranch: 新建分支
• miapp push: 提交代码
• miapp prepub: 预发（发布 beta 版本）
• miapp publish: 正式发布