Interfaces

slate fonctionne avec des objets json purs tout ce qu'il exige, c'est que ces objets json se conforment à certaines interfaces par exemple, un nœud de texte dans slate doit obéir à l' interface text interface text { text string } ce qui signifie qu'il doit avoir une propriété text avec une chaîne de contenu mais toute autre propriété personnalisée est également autorisée, et entièrement à votre discrétion cela vous permet d'adapter vos données à votre domaine et cas d'utilisation spécifiques, en ajoutant toute logique de formatage que vous souhaitez, sans que slate ne vous gêne cette approche basée sur des interfaces sépare slate de la plupart des autres éditeurs de texte enrichi qui exigent que vous travailliez avec leurs classes "modèle" faites maison, et rend la réflexion beaucoup plus facile cela signifie également qu'il évite les pénalités de temps de démarrage liées à "l'initialisation" du modèle de données propriétés personnalisées pour prendre un autre exemple, l' élément interface de nœud dans slate est interface element { children node\[] } c'est une interface très permissive tout ce qu'elle exige est que la children propriété soit définie contenant les nœuds enfants de l'élément mais vous pouvez étendre les éléments (ou toute autre interface) avec vos propres propriétés personnalisées qui sont spécifiques à votre domaine par exemple, vous pourriez avoir des éléments "paragraphe" et "lien" const paragraph = { type 'paragraph', children \[ ], } const link = { type 'link', url 'https //example com', children \[ ] } le type et url propriétés là sont votre propre api personnalisée slate voit qu'elles existent, mais ne les utilise jamais pour quoi que ce soit cependant, lorsqu'il s'agit de rendre un élément de lien, vous recevrez un objet avec les propriétés personnalisées attachées, afin que vous puissiez le rendre comme \<a href={element url}>{element children}\</a> lorsque vous commencez avec slate, il est important de comprendre toutes les interfaces qu'il définit il y en a quelques unes qui sont discutées dans chacun des guides fonctions d'aide en plus des informations de typage, chaque interface dans slate expose également une série de fonctions d'aide qui facilitent leur utilisation par exemple, lors de la manipulation de nœuds import { node } from 'slate' // get the string content of an element node const string = node string(element) // get the node at a specific path inside a root node const descendant = node get(value, path) ou, lors de la manipulation de plages import { range } from 'slate' // get the start and end points of a range in order const \[start, end] = range edges(range) // check if a range is collapsed to a single point if (range iscollapsed(range)) { // } il existe de nombreuses fonctions d'aide disponibles pour tous les cas d'utilisation courants lors de la manipulation des différentes interfaces lorsque vous commencez, il est utile de les lire toutes, car vous pouvez souvent simplifier une logique complexe en quelques lignes de code avec elles helpers personnalisés en plus des fonctions d'aide intégrées, vous pourriez vouloir définir vos propres fonctions d'aide personnalisées et les exposer sur vos propres espaces de noms personnalisés par exemple, si votre éditeur prend en charge les images, vous pourriez vouloir une fonction d'aide qui détermine si un élément est un élément image const isimageelement = element => { return element type === 'image' && typeof element url === 'string' } vous pouvez définir ces fonctions comme des fonctions uniques facilement mais vous pourriez également les regrouper dans des espaces de noms, tout comme le font les interfaces de base, et les utiliser à la place par exemple import { element } from 'slate' // you can use `myelement` everywhere to have access to your extensions export const myelement = { element, isimageelement, isparagraphelement, isquoteelement, } cela facilite la réutilisation de la logique spécifique au domaine aux côtés des helpers intégrés de slate