🔄 Mermaid

Tillståndsdiagram

Fånga varje tillstånd och övergång i ett system

Öppna detta exempel i editorn Generera ett med AI

Vad är ett Tillståndsdiagram?

Ett tillståndsdiagram visar de tillstånd ett objekt kan befinna sig i och de händelser som flyttar det mellan dem: orderlivscykler, dokumentflöden, UI-tillstånd, anslutningshantering. Oumbärligt så fort “vilket tillstånd är vi i?” spelar roll.

Live-exempel

Mermaid-kod

stateDiagram-v2
    [*] --> Draft
    Draft --> Review : submit
    Review --> Draft : request changes
    Review --> Approved : approve
    Approved --> Published : publish
    Published --> Archived : archive
    Archived --> [*]

Live-exempel

När det ska användas

Modellera livscykler för beställningar, ärenden eller dokument

Designa tillstånd för UI-komponenter och anslutningar

Specificera affärsregler kring statusövergångar

Grundläggande syntax

.mmd

stateDiagram-v2
    [*] --> Idle
    Idle --> Active : start
    Active --> [*] : stop

Frågor om detta diagram

Vad är skillnaden mot ett flödesschema?

Ett flödesschema följer en process från start till mål. Ett tillståndsdiagram beskriver alla möjliga tillstånd för en sak och vilka händelser som utlöser övergångar — inklusive cykler och feltillstånd.

Stöder Mermaid nästlade tillstånd?

Ja — stateDiagram-v2 stöder sammansatta (nästlade) tillstånd, forks, joins, val och anteckningar för realistiska tillståndsmaskiner.

Utforska andra diagramtyper

🔀 Flödesschema 💬 Sekvensdiagram 🧩 Klassdiagram 🗄️ Entitetsrelationsdiagram 📅 Gantt-schema 🥧 Cirkeldiagram 🧠 Tankekarta 🌿 Git-graf 🕰️ Tidslinje 🚶 Användarresa 🎯 Kvadrantdiagram

Skapa ditt Tillståndsdiagram nu

Beskriv det på vanligt språk — AI:n skriver Mermaid-koden åt dig.

Öppna Mermaid Studio