Editor API
51 min
l’ éditeur stocke tout l’état d’un éditeur slate il peut être étendu par plug ins docid\ cteaeew1cczvbmhe y3xr afin d’ajouter des aides et d’implémenter de nouveaux comportements c’est un type de nœud et son chemin est \[] interface editor { children node\[] selection range | null operations operation\[] marks omit\<text, 'text'> | null // schema specific node behaviors isinline (element element) => boolean isvoid (element element) => boolean normalizenode (entry nodeentry) => void onchange () => void // overrideable core actions addmark (key string, value any) => void apply (operation operation) => void deletebackward (unit 'character' | 'word' | 'line' | 'block') => void deleteforward (unit 'character' | 'word' | 'line' | 'block') => void deletefragment () => void insertbreak () => void insertfragment (fragment node\[]) => void insertnode (node node) => void inserttext (text string) => void removemark (key string) => void } méthodes d’instanciation docid\ emmtio53 dod5rqvthcixméthodes statiques docid\ emmtio53 dod5rqvthcixméthodes de récupération docid\ emmtio53 dod5rqvthcixméthodes de manipulation docid\ emmtio53 dod5rqvthcixméthodes de vérification docid\ emmtio53 dod5rqvthcixméthodes de normalisation docid\ emmtio53 dod5rqvthcixméthodes ref docid\ emmtio53 dod5rqvthcixméthodes d’instance docid\ emmtio53 dod5rqvthcixméthodes spécifiques au schéma à remplacer docid\ emmtio53 dod5rqvthcixméthodes de type element docid\ emmtio53 dod5rqvthcixméthode normalize docid\ emmtio53 dod5rqvthcixméthode de callback docid\ emmtio53 dod5rqvthcixméthodes mark docid\ emmtio53 dod5rqvthcixméthode getfragment docid\ emmtio53 dod5rqvthcixméthodes delete docid\ emmtio53 dod5rqvthcixméthodes insert docid\ emmtio53 dod5rqvthcixméthode de gestion des opérations docid\ emmtio53 dod5rqvthcix méthodes d’instanciation createeditor() => editor remarque cette méthode est importée directement depuis slate et ne fait pas partie de l’objet editor crée un nouvel objet éditeur vide méthodes statiques méthodes de récupération editor above\<t extends ancestor>(editor editor, options?) => nodeentry\<t> | undefined obtenez l’ancêtre correspondant au dessus d’un emplacement dans le document options at? location = editor selection où commencer, ce qui est editor selection par défaut match? nodematch = () => true restreindre la correspondance mode? 'highest' | 'lowest' = 'lowest' si le plus bas (par défaut), renvoie l’ancêtre correspondant le plus bas si le plus élevé , renvoie l’ancêtre correspondant le plus haut voids? boolean = false lorsque faux ignore les objets void editor after(editor editor, at location, options?) => point | undefined obtenez le point après un emplacement s’il n’y a aucun point après cet emplacement (par exemple, nous sommes en bas du document), renvoie undefined options {distance? number, unit? 'offset' | 'character' | 'word' | 'line' | 'block', voids? boolean} editor before(editor editor, at location, options?) => point | undefined obtenez le point avant un emplacement s’il n’y a aucun point avant cet emplacement (par exemple, nous sommes en haut du document), renvoie undefined options {distance? number, unit? 'offset' | 'character' | 'word' | 'line' | 'block', voids? boolean} editor edges(editor editor, at location) => \[point, point] obtenez les points de début et de fin d’un emplacement editor end(editor editor, at location) => point obtenez le point de fin d’un emplacement editor first(editor editor, at location) => nodeentry obtenez le premier nœud à un emplacement editor fragment(editor editor, at location) => descendant\[] obtenez le fragment à un emplacement editor last(editor editor, at location) => nodeentry obtenez le dernier nœud à un emplacement editor leaf(editor editor, at location, options?) => nodeentry obtenez le nœud de texte leaf à un emplacement options {depth? number, edge? 'start' | 'end'} editor levels\<t extends node>(editor editor, options?) => generator\<nodeentry\<t>, void, undefined> itérez à travers tous les niveaux à un emplacement options {at? location, match? nodematch, reverse? boolean, voids? boolean} editor marks(editor editor) => omit\<text, 'text'> | null obtenez les marks qui seraient ajoutés au texte à la sélection actuelle editor next\<t extends descendant>(editor editor, options?) => nodeentry\<t> | undefined obtenez le nœud correspondant dans la branche du document après un emplacement remarque si vous recherchez le point suivant, et non le node suivant, vous recherchez probablement la méthode editor after options {at? location, match? nodematch, mode? 'all' | 'highest' | 'lowest', voids? boolean} editor node(editor editor, at location, options?) => nodeentry obtenez le nœud à un emplacement options depth? number, edge? 'start' | 'end' editor nodes\<t extends node>(editor editor, options?) => generator\<nodeentry\<t>, void, undefined> à tout emplacement ou portée dans l’éditeur fourni par à (la sélection actuelle par défaut), la méthode renvoie un generator de nodeentry qui représentent les nœuds qui incluent à au sommet de la hiérarchie se trouve l’objet éditeur lui‑même options {at? location | span, match? nodematch, mode? 'all' | 'highest' | 'lowest', universal? boolean, reverse? boolean, voids? boolean} options match fournissez une valeur à l’option correspondance ? afin de limiter les objets nodeentry qui sont retournés options mode 'tous' (par défaut) retourner tous les nœuds correspondants 'le plus élevé' dans une hiérarchie de nœuds, retourner uniquement les nœuds correspondants au niveau le plus élevé 'le plus bas' dans une hiérarchie de nœuds, retourner uniquement les nœuds correspondants au niveau le plus bas editor parent(editor editor, at location, options?) => nodeentry\<ancestor> obtenir le nœud parent d’un emplacement options {depth? number, edge? 'start' | 'end'} editor path(editor editor, at location, options?) => path obtenir le chemin d’un emplacement options {depth? number, edge? 'start' | 'end'} editor point(editor editor, at location, options?) => point obtenir le point de début ou de fin d’un emplacement options {edge? 'start' | 'end'} editor positions(editor editor, options?) => generator\<point, void, undefined> itérer à travers toutes les positions dans le document où un point peut être placé le premier point retourné est toujours le point de départ suivi du point suivant tel que déterminé par l’option unité lisez options unit pour voir comment cette méthode itère à travers les positions remarque par défaut, les nœuds void sont traités comme un seul point et aucune itération ne se produit dans leur contenu, sauf si vous transmettez la valeur true pour l’option voids, auquel cas l’itération se produira options at? location = editor selection le emplacement dans lequel itérer les positions unité? 'décalage' | 'caractère' | 'mot' | 'ligne' | 'bloc' = 'décalage' décalage passe au point de décalage suivant cela inclura le point à la fin d’un objet texte puis passera au premier point (au décalage 0) du texte suivant cela peut être contre intuitif, car la fin d’un texte et le début du texte suivant peuvent être considérés comme la même position caractère passe au caractère suivant mais ce n’est pas toujours l’ index suivant dans la chaîne ceci est dû au fait que les encodages unicode peuvent nécessiter plusieurs octets pour créer un seul caractère contrairement à décalage , caractère ne comptera pas la fin d’un texte et le début du texte suivant comme des positions séparées à retourner avertissement les décalages de caractères pour les caractères unicode ne semblent pas fiables dans certains cas, par exemple un smiley emoji sera identifié comme 2 caractères mot passe à la position immédiatement après le mot suivant en mode inverse , passe à la position immédiatement avant le mot précédent ligne | bloc commence à la position de début puis à la position de fin du bloc puis commence au début du bloc suivant puis à la fin du bloc suivant reverse? boolean = false lorsque vrai retourne les positions dans l’ordre inverse dans le cas où l’ unité est mot , les positions réellement retournées sont différentes (c’est à dire que nous obtiendrons le début d’un mot en mode reverse au lieu de la fin) voids? boolean = false lorsque vrai inclure les nœuds void editor previous\<t extends node>(editor editor, options?) => nodeentry\<t> | undefined obtenir le nœud correspondant dans la branche du document avant un emplacement remarque si vous recherchez le point précédent, et non le node précédent, vous recherchez probablement la méthode editor before options {at? location, match? nodematch, mode? 'all' | 'highest' | 'lowest', voids? boolean} editor range(editor editor, at location, to? location) => range obtenir une plage à partir d’un emplacement editor start(editor editor, at location) => point obtenir le point de départ d’un emplacement editor string(editor editor, at location, options?) => string obtenir le contenu textuel d’un emplacement sous forme de chaîne remarque par défaut, le texte des nœuds void est considéré comme une chaîne vide, quel que soit le contenu, sauf si vous transmettez true pour l’option voids options {voids? boolean} editor void(editor editor, options?) => nodeentry\<element> | undefined faire correspondre un nœud void dans la branche actuelle de l’éditeur options {at? location, mode? 'highest' | 'lowest', voids? boolean} méthodes de manipulation editor addmark(editor editor, key string, value any) => void ajouter une propriété personnalisée aux nœuds de texte feuille dans la sélection actuelle si la sélection est actuellement réduite, les marques seront ajoutées à la propriété editor marks et appliquées lors de l’insertion du texte suivant editor deletebackward(editor editor, options?) => void supprimer le contenu dans l’éditeur en arrière à partir de la sélection actuelle options {unit? 'caractère' | 'mot' | 'ligne' | 'bloc'} editor deleteforward(editor editor, options?) => void supprimer le contenu dans l’éditeur en avant à partir de la sélection actuelle options {unit? 'caractère' | 'mot' | 'ligne' | 'bloc'} editor deletefragment(editor editor) => void supprimer le contenu dans la sélection actuelle editor insertbreak(editor editor) => void insérer un saut de bloc à la sélection actuelle editor insertfragment(editor editor, fragment node\[]) => void insérer un fragment à la sélection actuelle si la sélection est actuellement étendue, elle sera d’abord supprimée pour insérer des nœuds de manière atomique (y compris tout au début ou à la fin), utilisez transforms insertnodes docid\ n1djuyjsvzlrs5eeg5z1v editor insertnode(editor editor, node node) => void insérer un nœud à la sélection actuelle si la sélection est actuellement étendue, elle sera d’abord supprimée pour insérer un nœud de manière atomique (y compris tout au début ou à la fin), utilisez transforms insertnodes docid\ n1djuyjsvzlrs5eeg5z1v editor inserttext(editor editor, text string) => void insérer du texte à la sélection actuelle si la sélection est actuellement étendue, elle sera d’abord supprimée editor removemark(editor editor, key string) => void supprimer une propriété personnalisée de tous les nœuds de texte feuille dans la sélection actuelle si la sélection est actuellement réduite, la suppression sera stockée dans editor marks et appliquée au texte inséré ensuite editor unhangrange(editor editor, range range, options?) => range convertir une plage en une plage non suspendue une plage « suspendue » est une plage créée par le comportement de sélection « triple clic » du navigateur lors d’un triple clic sur un bloc, le navigateur sélectionne du début de ce bloc jusqu’au début du bloc suivant la plage « dépasse » ainsi dans le bloc suivant si unhangrange reçoit une telle plage, il déplace la fin vers l’arrière jusqu’à ce qu’elle se trouve dans un nœud textuel non vide qui précède le bloc suspendu notez que unhangrange est conçu spécifiquement pour corriger les blocs sélectionnés par triple clic, et comporte donc actuellement un certain nombre de limitations il ne modifie pas le début de la plage ; uniquement la fin par exemple, il ne « désaccroche » pas une sélection qui commence à la fin d’un bloc précédent il n’agit que si le bloc de début est entièrement sélectionné par exemple, il ne gère pas les plages créées en double cliquant la fin d’un paragraphe (que les navigateurs traitent en sélectionnant de la fin de ce paragraphe jusqu’au début du suivant) options voids? boolean = false autoriser le placement de la fin de la sélection dans un nœud void méthodes de vérification editor hasblocks(editor editor, element element) => boolean vérifier si un nœud possède des enfants de type block editor hasinlines(editor editor, element element) => boolean vérifier si un nœud possède des enfants inline et text editor hastexts(editor editor, element element) => boolean vérifier si un nœud possède des enfants text editor isblock(editor editor, value any) => value is element vérifier si une valeur est un objet élément de type block editor iseditor(value any) => value is editor vérifier si une valeur est un objet éditeur editor isend(editor editor, point point, at location) => boolean vérifier si un point est le point de fin d’une location editor isedge(editor editor, point point, at location) => boolean vérifier si un point est un bord d’une location editor isempty(editor editor, element element) => boolean vérifier si un élément est vide, en tenant compte des nœuds void editor isinline(editor editor, value any) => value is element vérifier si une valeur est un objet élément de type inline editor isnormalizing(editor editor) => boolean vérifier si l’éditeur est en cours de normalisation après chaque opération editor isstart(editor editor, point point, at location) => boolean vérifier si un point est le point de début d’une location editor isvoid(editor editor, value any) => value is element vérifier si une valeur est un objet élément de type void méthodes de normalisation editor normalize(editor editor, options?) => void normaliser tous les objets modifiés dans l’éditeur options {force? boolean} editor withoutnormalizing(editor editor, fn () => void) => void appeler une fonction en différant la normalisation jusqu’à ce qu’elle soit terminée voir normalisation implications pour les autres codes docid\ emmtio53 dod5rqvthcix ; méthodes ref editor pathref(editor editor, path path, options?) => pathref créer une ref mutable pour un objet chemin qui restera synchronisé à mesure que de nouvelles opérations seront appliquées à l’éditeur options {affinity? 'backward' | 'forward' | null} editor pathrefs(editor editor) => set\<pathref> obtenir l’ensemble des refs de path actuellement suivies par l’éditeur editor pointref(editor editor, point point, options?) => pointref créer une ref mutable pour un objet point qui restera synchronisé à mesure que de nouvelles opérations seront appliquées à l’éditeur options {affinity? 'backward' | 'forward' | null} editor pointrefs(editor editor) => set\<pointref> obtenir l’ensemble des refs de point actuellement suivies par l’éditeur editor rangeref(editor editor, range range, options?) => rangeref créer une ref mutable pour un objet plage qui restera synchronisé à mesure que de nouvelles opérations seront appliquées à l’éditeur options {affinity? 'backward' | 'forward' | 'outward' | 'inward' | null} editor rangerefs(editor editor) => set\<rangeref> obtenir l’ensemble des références de plage actuellement suivies de l’editor méthodes d’instance méthodes d’instance spécifiques au schéma à remplacer remplacez ces méthodes pour modifier le comportement d’origine de l’editor lors de la création de plugins docid\ cteaeew1cczvbmhe y3xr lors de la modification du comportement, appelez la méthode originale lorsque cela est approprié par exemple, un plugin qui marque les nœuds image comme « void » const withimages = editor => { const { isvoid } = editor editor isvoid = element => { return element type === 'image' ? true isvoid(element) } return editor } méthodes de type element utilisez ces méthodes afin que slate puisse identifier certains éléments comme éléments en ligne docid\ cvnf gy7od8ojhx0veaow ou vides docid\ cvnf gy7od8ojhx0veaow isinline(element element) => boolean vérifier si une valeur est un objet élément inline isvoid(element element) => boolean vérifier si une valeur est un objet élément void méthode de normalisation normalizenode(entry nodeentry) => void normaliser docid km0kskcah3d8vjg9uzu8 un node conformément au schéma méthode de rappel onchange() => void appelé lorsqu’un changement survient dans l’editor méthodes de marque addmark(key string, value any) => void ajouter une propriété personnalisée aux nœuds de texte feuille dans la sélection actuelle si la sélection est actuellement réduite, les marques seront ajoutées à la propriété editor marks et appliquées lors de la prochaine insertion de texte removemark(key string) => void supprimer une propriété personnalisée des nœuds de texte feuille dans la sélection actuelle méthode getfragment getfragment() => descendant retourne le fragment à la sélection actuelle utilisé lors de la coupe ou de la copie, par exemple, pour obtenir le fragment à la sélection actuelle méthodes de suppression lorsqu’un utilisateur appuie sur retour arrière ou supprimer, cela invoque la méthode en fonction de la sélection par exemple, si la sélection est étendue sur du texte et que l’utilisateur appuie sur la touche retour arrière, deletefragment sera appelé mais si la sélection est réduite, deletebackward sera appelé deletebackward(options? {unit? 'character' | 'word' | 'line' | 'block'}) => void supprimer du contenu dans l’editor en arrière à partir de la sélection actuelle deleteforward(options? {unit? 'character' | 'word' | 'line' | 'block'}) => void supprimer du contenu dans l’editor en avant à partir de la sélection actuelle deletefragment() => void supprimer le contenu de la sélection actuelle méthodes d’insertion insertfragment(fragment node\[]) => void insérer un fragment à la sélection actuelle si la sélection est actuellement étendue, la supprimer d’abord insertbreak() => void insérer un saut de bloc à la sélection actuelle si la sélection est actuellement étendue, la supprimer d’abord insertsoftbreak() => void insérer un saut doux à la sélection actuelle si la sélection est actuellement étendue, la supprimer d’abord insertnode(node node) => void insérer un nœud à la sélection actuelle si la sélection est actuellement étendue, la supprimer d’abord inserttext(text string) => void insérer du texte à la sélection actuelle si la sélection est actuellement étendue, la supprimer d’abord méthode de gestion des opérations apply(operation operation) => void appliquer une opération dans l’éditeur