Liigu põhisisu juurde

Põhimõisted

Ploki mudel

EditorData tuum on blocks massiiv: Block objektid, mis säilitavad järjestuse. Iga Block kannab oma tüüpi, tüübispetsiifilisi andmeid ja valikulisi tunes metaandmeid.

VäliTüüpKirjeldus
idstring | undefinedValikuline unikaalne identifikaator, määratakse redaktori poolt loomisel.
typeBlockToolTypeSõnasõnaline võti, mis seob ploki selle skeemi, sisendkomponendi ja renderdajaga.
dataobjectTüübispetsiifiline andmeobjekt: kuju erineb iga plokitüübi puhul.
tunesBlockTunes | undefinedValikuline tüübideülene tune metaandmete sõnastik. Võti on tune nimi, väärtus on vabas vormis andmed.
JSON
{
  "time": 1745000000000,
  "version": "1.0.0",
  "blocks": [
    {
      "id": "abc123",
      "type": "header",
      "data": { "html": "Hello world", "level": "h1" }
    },
    {
      "id": "def456",
      "type": "paragraph",
      "data": { "html": "This is a <b>rich</b> paragraph." }
    }
  ]
}

Plokitööriistad vs tekstisisesed tööriistad

Plokitööriistad loovad ülataseme pesasid otse EditorData sees. Tekstisisesed tööriistad kaunistavad teksti html-koormuse sees, mida plokk sisaldab. Kaks kihti on täiesti eraldiseisvad. Neid ei saa üksteisega asendada.

JSON-esmane väljund

Redaktor ei salvestata kunagi HTML-i. Kui kutsute editor.data.extract(), saate puhta EditorData JSON-i: täieliku, sealhulgas meedia URL-idega. Seda JSON-i saab salvestada andmebaasi, isikupärastada või teistesse vormingutesse teisendada.

TypeScript
import { Editor } from '@clepit/core';

const editor = Editor.create({ containerId: 'editor' });

const data = editor.data.extract();
// data: EditorData
// {
//   time: 1745000000000,
//   version: '1.0.0',
//   blocks: [ ... ]
// }

Editor vs Renderer

Editor kasutab brauseri DOM-i, et kasutaja saaks sisu redigeerida (ainult brauser). Renderer võtab eelnevalt salvestatud EditorData ja renderdab selle HTML-ina (saab käitada brauseris või SSR kaudu).

Ploki tuned

Tuned on tüübist sõltumatu metaandmete pesa mis tahes plokitüübi jaoks. Võti on tune nimi, mille määrab süsteem või plugin, ja väärtus on tüübistatud BlockTuneData-ks: mis tahes kombinatsioon string, number, boolean või null. Tuned saavad lisada semantikat ilma põhiandmete kuju rikkumata.

JSON
{
  "id": "abc123",
  "type": "paragraph",
  "data": { "html": "Some text." },
  "tunes": {
    "textAlign": { "alignment": "center" },
    "visibility": { "hidden": false }
  }
}