redux - TypeScript-gränssnitt med spridda medlemmar

Jag importerar en massa fastigheter i bulk med

import * as actionCreators from './billingUtil2';

och TypeScript identifierar korrekt varje export inuti actionCreators. Är det möjligt att "sprida" dessa medlemmar till ett interface? Helst något sådant här, men giltigt

interface componentState {
    ...actionCreators
}

Mitt användningsfall är att jag skulle vilja skapa en React-komponent och noggrant beskriva formen på de props den kommer att ta emot från Redux. Så idealiskt något i den här stilen

import * as actionCreators from './billingUtil2';

interface State {
    name: string;
    age: number
}

interface componentState extends State {
    ...actionCreators
}

och sedan skulle jag kunna berätta för TypeScript att förvänta sig props i formen componentState. Mina redux-reducers skulle redan returnera resultat som implementerar ett gränssnitt; mitt huvudmål här är att undvika att manuellt skriva ut varje action creator.

Svar #1

Du skulle kunna skapa en intersections typ

import * as actionCreators from './billingUtil2';

type MyState = typeof actionCreators & {
    name: string
    age: number
}

eller från din kod i den andra sektionen ovan, där du hade State-gränssnittet, kunde du göra

import * as actionCreators from './billingUtil2';

interface State {
    name: string;
    age: number
}

type componentShape = typeof actionCreators & State;

eller du skulle kunna göra på liknande sätt

type acT = typeof actionCreators
interface MyState extends acT {
    name; age;
}

class Comp extends React.Component<{}, MyState> {

}

Relaterade artiklar