javascript - Hur uppdaterar man React-tillståndet när en parameter i tillståndet är en Map?


Tillståndet för en React-komponent i min app är av följande typ:

interface ComponentState {
    messages: Map<string, Messages[]>;
}

Hur uppdaterar man komponentens tillstånd med hjälp av setState?

Jag försökte följande, men det ändrar messages till ett Object från en Map. Dessutom fångas inte följande av TypeScript.

this.setState((prevState) => ({
    messages: {
        ...prevState.messages,
        [someKeyAsString]: someValue,
    }
}));

Finns det ett sätt att använda en Map som en state-egenskap och uppdatera den på rätt sätt med setState och samtidigt inte ändra typen på parametern från Map till Object

Svar #1

Även om det är möjligt att använda en Map i React, är det mycket märkligt eftersom koden som krävs för att klona den är invecklad - du måste först omvandla Mapen till en entries-array, sedan lägga till den extra posten, och sedan göra om den till en Map igen:

this.setState((prevState) => ({
    messages: new Map([
      ...(prevState.messages.entries()),
     ['someKeyAsString', 'someValue']
    ])
}));

Jag skulle starkt rekommendera att använda ett vanligt objekt istället.

Relaterade artiklar