realmerit-mobx

doc

- createContainer 工厂函数创建上下文

``tsx
class Test {
count: number;
constructor() {
this.count = 0;
makeAutoObservable(
this,
{},
{
autoBind: true,
}
);
}
inc() {
this.count += 1;
}
}
const { Provider, useStore } = createContainer(() =>
useLocalObservable(() => new Test())
);

const Count: React.FC = observer(() => {
const store = useStore();

return (


`ts
class Test {
loadingStore: LoadingStore<'loadingName'>;
constructor() {
this.loadingStore = new LoadingStore();
// this.invoke必须是一个async
// 第二个参数不填则代表不需要loading
this.invoke = withRequest(this.invoke, 'loading的key');
}
async invoke() {
// do sth
}
// 获得loading
this.loadingStore.get(loading的key)
}
`

- TableStore 类似 usePagenation 内聚 table 的各种

`ts
class Test {
tableStore: TableStore;
constructor() {
this.tableStore = new TableStore(Api.getData, {
// rowKey 必传
rowKey: 'id',
defaultPageSize: 50,
currentKey: 'current',
pageSizeKey: 'pageSize',
defaultParam: { defaultParam: 'i am defaultParam' },
// formatResult强制返回total,dataSource的格式
formatResult: res => {
return {
total: res.total,
dataSource: res.dataSource,
};
},
});
}
}
const t = new Test();
// t.tableStore.table => 返回NETable需要的各种(只读)
// t.tableStore.dataSource => 返回dataSource提供修改
`

- 如何在 store 里使用 props

`tsx
class Store {
propsStore: PropsStore;
constructor() {
this.propsStore = new PropsStore();
// xxx
}
}

const A = observer(props => {
const store = useStore();
useSyncProps(store, 'id', props.id);
return ;
});

const B = observer(props => {
const store = useStore();
return