lms-componentsDemo
Alle Komponenten

LmsOrdering

Lern-Interaktion

Einträge in die richtige Reihenfolge bringen.

In Markdown: ::lms-ordering Im Zusammenhang ansehen
Die Aufgabenform für alles, wo die Abfolge die Aussage ist. Eine Liste in der richtigen Reihenfolge vorzulegen und danach zu fragen, wäre etwas anderes — hier muss man die Ordnung selbst herstellen. Zusammengezogen aus zwei H5P-Inhaltstypen: Image Sequencing und Sort the Paragraphs. Bei H5P sind es zwei Pakete, weil es dort keine Varianten gibt; hier ist es dieselbe Mechanik, und ob im Kärtchen ein Bild, ein Text oder beides steht, entscheidet der Inhalt. Umgeordnet wird durch Ziehen oder mit den Pfeilen. Ziehen allein — wie bei H5P — schließt Tastatur und Tastfeld aus. scoring kennt zwei Arten: positions zählt, was an der richtigen Stelle steht, transitions, was dem richtigen Vorgänger folgt. Die Vorgabe ist positions, und zwar wegen der Rückmeldung, nicht wegen des Punktestands: „das steht falsch" ist unmittelbar umsetzbar. transitions bewertet milder — ein Fehler am Anfang kostet dort nicht alles.

Beispiele (3)

Absätze ordnen

Sort the Paragraphs. Die Einträge stehen im Markdown in der richtigen Reihenfolge; angezeigt werden sie gemischt.

Bringen Sie die Schritte einer Erstmeldung in die richtige Reihenfolge.

Ziehen Sie die Einträge in die richtige Reihenfolge — oder verschieben Sie sie mit den Pfeilen.

  1. 1Betroffene Systeme eingrenzen und vom Netz nehmen.
  2. 2Erstmeldung binnen 24 Stunden an das BSI absetzen.
  3. 3Vorfall feststellen und den Zeitpunkt notieren.
  4. 4Vollständigen Bericht binnen 72 Stunden nachreichen.
  5. 5Interne Meldekette auslösen — Geschäftsleitung und IT informieren.

Bilder in Reihenfolge

Image Sequencing. Bei durchgehend bebilderten Einträgen wird daraus ein Raster.

In welcher Reihenfolge läuft die Bearbeitung eines Vorfalls?

Ziehen Sie die Einträge in die richtige Reihenfolge — oder verschieben Sie sie mit den Pfeilen.

  1. 1Lupe über einem DokumentErkennen
  2. 2Abgehakte ListeNachbereiten
  3. 3SchildEindämmen
  4. 4MegafonMelden
  5. 5SchraubenschlüsselBeheben

Nach Übergängen bewertet

Mit scoring="transitions" zählt, was dem richtigen Vorgänger folgt — ein Fehler am Anfang kostet dann nicht alles.

Wie entstand die NIS-2? Ordnen Sie die Stationen.

Ziehen Sie die Einträge in die richtige Reihenfolge — oder verschieben Sie sie mit den Pfeilen.

  1. 1NIS-2 — die Nachfolgerichtlinie tritt in Kraft
  2. 2EU Cyber Security Act — Stärkung der ENISA
  3. 3NIS2UmsuCG — das deutsche Umsetzungsgesetz
  4. 4CER-Richtlinie — Schutz kritischer Infrastrukturen
  5. 5NIS-1 — ein Mindestniveau an IT-Sicherheit in der EU

API

Vollständig aus den Quellen erzeugt. Dieselben Angaben stehen an jedem Beispiel hinter dem Knopf API — hier ausgeschrieben, damit sie über die Seitensuche und im Druck auffindbar bleiben.

Props

PropTypStandardBedeutung
idPflichtstring—Eindeutig im Dokument. Schlüssel für den gespeicherten Stand.
taskstring—Die Aufgabenstellung. Inline-Markdown erlaubt.
itemsLmsOrderItem[]() => []Die Einträge in der **richtigen** Reihenfolge. Angezeigt wird gemischt.
scoring'positions' | 'transitions''positions'`positions` zählt richtige Plätze, `transitions` richtige Übergänge.
layout'auto' | 'list' | 'grid''auto'`grid` stellt Bildkacheln nebeneinander, `list` untereinander.
colorTone'primary'Semantische Farbrolle.

Slots

Dieser Baustein hat keine Slots — sein Inhalt kommt vollständig aus den Props.

Emits

Dieser Baustein sendet keine Events.

Theme

Die Beschriftungen dieses Bausteins stehen in der Gruppe lms.labels.quiz. Alle Schlüssel sind einzeln überschreibbar — was nicht gesetzt wird, behält die Vorgabe. 

// app.config.ts
export default defineAppConfig({
  lms: {
    labels: {
      quiz: {
        check: 'Antwort prüfen',
        reset: 'Nochmal',
        resetAll: 'Quiz zurücksetzen',
        multiple: 'Mehrfachauswahl möglich',
        correct: 'Richtig',
        incorrect: 'Nicht ganz',
        optionCorrect: 'richtig',
        optionWrong: 'falsch',
        summary: '{checked} von {total} Fragen geprüft · {correct} richtig',
        allCorrect: 'Alles richtig.',
        someWrong: 'Sehen Sie sich die rot markierten Fragen noch einmal an.',
        checkEach: 'Prüfen Sie jede Frage einzeln.'
      }
    }
  }
})

Changelog

  1. Hinzugefügt1.6.0

    (Lern-Interaktion) — Einträge in die richtige Reihenfolge

  2. Geändert0.7.0

    src/runtime/utils/totp.ts kommt hinzu: TOTP in reinem JavaScript, gegen die Testvektoren des RFC geprüft. Einzige Änderung gegenüber der Quelle sind Nicht-Null-Zusicherungen an den Feldzugriffen — der Bestand an @ts-nocheck bleibt bei 51, und keine Ausnahme liegt außerhalb von fx/

  3. Hinzugefügt0.6.0

    useLmsProgress: Fortschritt lässt sich speichern, ohne dass die Bibliothek ein Backend kennt. Das Zielprojekt hinterlegt einmal einen Adapter mit get/set, die Bausteine nutzen ihn, wenn er da ist — sonst halten sie den Stand im Speicher wie bisher. Ereignisse wären hier nutzlos: MDC kann keine Events abonnieren, und genau dort werden diese Bausteine benutzt

  4. Behoben0.4.0

    Die Warnung Slot "default" invoked outside of the render function erscheint nicht mehr. Der Katalog läuft jetzt mit 0 Fehlern und 0 Warnungen

  5. Hinzugefügt0.3.0

    Der MDC-Bereich jedes Beispiels ist jetzt ein Editor: Syntaxhervorhebung, Code-Vervollständigung aus der Registry, Prüfung in sechs Stufen und eine Vorschau, die beim Tippen mitläuft. Oben rechts Zurücksetzen und Kopieren

  6. Hinzugefügt0.3.0

    Die Prüfung meldet unbekannte Bausteine, unbekannte Props, fehlende Pflicht-Props, unbekannte Slots, Events (die MDC nicht abonnieren kann) und den Typkonflikt, an dem man in MDC am häufigsten hängenbleibt: Inline-Attribute sind immer Zeichenketten, {count=14} übergibt "14"

  7. Hinzugefügt0.2.0

    API-Ansicht je Baustein: Props, Slots, Emits, Theme und dieser Changelog. In der Demo-Hülle als Reiter hinter dem Knopf API, auf der Detailseite ausgeschrieben

  8. Hinzugefügt0.2.0

    Emits werden dokumentiert. Sie sind der Grund, warum sich manche Bausteine aus Markdown heraus nicht vollständig bedienen lassen: MDC kann keine Events abonnieren

  9. Geändert0.2.0

    Die Komponentenreferenz der README wird jetzt vollständig erzeugt statt von Hand gepflegt

  10. Geändert0.2.0

    Auch die Tabelle der optionalen Abhängigkeiten wird erzeugt. Sie war gedriftet: motion-v stand mit 50 statt 54 Komponenten darin, @uiw/color-convert unter „je 1", obwohl es drei sind

  11. Hinzugefügt0.1.0

    Erstveröffentlichung: 187 Bausteine in 17 Kategorien, davon 40 didaktische Lms- und 147 dekorative Fx-Bausteine aus Inspira UI