Anmeldung

Die Grundidee, einen Blockeditor zu erstellen

Autor:Neo-Yang Zeit:2021/12/12 Lesen: 3893
Beziehen Sie sich hauptsächlich auf zwei Blockeditoren: den Gutenberg-Editor von WordPress: https://wordpress.org […]

Beziehen Sie sich hauptsächlich auf zwei Blockeditoren:

Gutenberg-Editor für WordPress: https://wordpress.org/gutenberg/

editorjs-Editor: https://editorjs.io/

1. Architektur

MVVM-Architektur

M-Schicht: reines JSON, siehe editorjs für diesen Punkt. Gutenbergs M-Layer ist stark an WordPress selbst gebunden (Anmerkungen + Shortcodes) und es lohnt sich nicht, darauf zu verweisen.

Schicht V: Gutenbergs Methode ist besser geeignet.

VM-Schicht: Keine.

2. Blöcke

Alle Blöcke haben zwei Zustände: Anzeigen und Bearbeiten.

Beim Anzeigen von Inhalten, die vom Blockeditor erstellt wurden, wird der Status des Blocks angezeigt.

Wenn Sie den Blockeditor zum Bearbeiten von Inhalten verwenden, lautet der Status des Blocks „Bearbeiten“.

Die Anzeige der beiden Zustände bleibt konsistent und erreicht „What you see is what you get“.

Der Edit-State-Block baut auf dem Basisblock auf.

3. Grundblock

Alle Bausteine basieren auf diesem Grundbaustein.

Hier finden Sie die wichtigsten Interaktionen im Bearbeitungsstatus des Blocks.

4. Editor-Seite

Die Hauptseite des Editors rendert Blöcke basierend auf Daten und Datenänderungen.

5. Block-Renderer

Wenn Sie den vom Blockeditor erstellten Inhalt anzeigen, müssen Sie die JSON-Daten analysieren und Blöcke basierend auf den JSON-Daten rendern.

Stichworte: ,


Copyright © www.lyustu.com, alle Rechte vorbehalten.
Thema: TheMoon V3.0. Autor: neo yang