Estoy tratando de envolver un objeto de actions con funciones como propiedades. Cada función tiene un argumento ActionContext.
Al definir las funciones, la propiedad de state en el contexto debe ser accesible. Pero al llamar al método, el state ya no debería ser accesible, ya que se inyectará.
Primero traté de hacer esto con 2 argumentos separados en cada función, pero me pareció incorrecto y no parecía lo suficientemente flexible. Por lo tanto, estoy usando solo 1 argumento ctx ahora.
Enfoque de solución #1: ¿Cómo puedo volver a mapear dinámicamente un objeto lleno de funciones usando TypeScript?
El tipo de devolución en useActions = (state: any): T , por supuesto, no es correcto, pero aquí quiero que los tipos en las actions -objeto se asignen del tipo Acción al tipo CallableAction con su tipo de Context inferido.
Pero estoy luchando por cómo inferir estos tipos, si es posible. ¿O tal vez solo estoy escribiendo demasiado? Bastante nuevo en mecanografiado.
type ActionContext<S=any, P=any> = { state: S, params: P }; type Action = <T extends ActionContext>(ctx: T) => any; type CallableActionContext<T> = T extends ActionContext ? Omit<T, 'state'> : never type CallableAction<T=any> = (ctx: CallableActionContext<T>) => any type SaveActionContext = ActionContext<any, {id: string}> interface Supplier { name: string; } // add ctx types in actions const actions = { save: async (ctx: SaveActionContext): Promise<Supplier> => { console.log('Mocked: useActions.save'); const tralala = ctx.params.id await Promise.resolve(tralala) return {name: 's1'}; } } // this is what the resulting action object should look like // calling mapped actions and omitting `state` property): // const save: CallableAction<SaveActionContext> = (ctx) => { // ctx.params.id // return new SupplierVM // } // const ret = save({params:{id: '2'}}) const createActions = <T extends Record<keyof T, Action>>(actions: T) => { const useActions = (state: any): T => { const injectCtx = (action: Action, ctx: any) => { const enrichedCtx = {...ctx, state: state} as ActionContext return action(enrichedCtx) } return Object.entries(actions).reduce((prev: any, [fnName, fn]: any) => ({ ...prev, [fnName]: (ctx: any) => injectCtx(fn, ctx) }), {}); } return useActions } const state = reactive({}) const useActions = createActions(actions) const acts = useActions(state) acts.save({params: { id: '3'}, state: {}})Tal vez debería cambiar (state: any): T :
const useActions = (state: any): { [K in keyof T]: CallableAction<Parameters<T[K]>[0]> } => { Estamos pasando por cada acción, obteniendo el primer parámetro, (SaveActionContext), luego lo pasamos a CallableAction , que nos da el tipo de contexto deseado.