> dynamic load rematch model
npm install use-rematch-modelNOTE: use-rematch-model@v0.x.x based on @rematch/core; use-rematch-model@v1.x.x based on @rematch2/core;
  
- use-rematch-model
- how it works?
- features
- useage
- Q&A
just use rematchstore.model in react hooks
1. support dynamic load rematch model with hooks
2. support dynamic load rematch model with hooks and model.name
config store
``ts
import { init } from '@rematch/core'
import { config } from 'use-rematch-model'
const store = init({
models: {
globalModel
}
})
config.store = store
`
dynamic load model
`tsx
// rematch model named about
export type State = number
export const about = {
name: 'about',
state: 0,
reducers: {
increment: (state: State) => state + 1,
},
effects: {
async incrementAsync(this: any) {
this.increment()
},
},
}
import React from 'react'
import { useRematchModel } from 'use-rematch-model'
import { about } from './models/about'
export default () => {
const [state, dispatch] = useRematchModel(about)
const handleClick = () => dispatch.increment()
return (
use about in any fc component
`tsx
import React from 'react'
import { useRematchModel } from 'use-rematch-model'export const Counter = () => {
const [state] = useRematchModel('about') // or useRematchModel(about)
return (
add {state}
)
}
`Q&A
1.
useRematchModel(about) vs useRematchModel('about') -
useRematchModel(about) in many components, about-model will be loaded by rematch if about-model did not exit in rematch models. if about-model already exit in rematch models, behave same as useRematchModel('about')
- useRematchModel('about') will get state and dispatch from redux-store2. how to imporve type intellience for
useRematchModel('about'). You need overwrite default State and Dispatch types in typings.d.ts
`ts
import { ExtractRematchStateFromModels, ExtractRematchDispatchersFromModels } from '@rematch/core' declare module 'use-rematch-model/default' {
export interface DynamicRootState extends ExtractRematchStateFromModels {}
export interface DynamicRootDispatch extends ExtractRematchDispatchersFromModels {}
}
``