Lieux

les locations sont la manière dont vous faites référence à des emplacements spécifiques dans le document lors de l’insertion, de la suppression ou de toute autre action avec un éditeur slate il existe différents types d’interfaces de location, chacun pour des cas d’utilisation distincts chemin les paths sont la manière la plus basique de référencer une location chaque path est un simple tableau de nombres qui fait référence à un nœud dans l’arbre du document par ses index dans chacun de ses nœuds ancêtres, tout le long de l’arbre type path = number\[] par exemple, dans ce document const editor = { children \[ { type 'paragraph', children \[ { text 'a line of text!', }, ], }, ], } le nœud de texte feuille aurait un path de \[0, 0] l’editor lui même a un path de \[] par exemple, pour sélectionner l’ensemble du contenu de l’éditeur, appelez transforms select(editor, \[]) point les points sont légèrement plus spécifiques que les paths et contiennent un décalage dans un nœud de texte particulier leur interface est interface point { path path offset number } par exemple, avec ce même document, si vous vouliez faire référence au tout premier endroit où vous pouvez placer votre curseur, ce serait const start = { path \[0, 0], offset 0, } ou, si vous vouliez faire référence à la fin de la phrase const end = { path \[0, 0], offset 15, } il peut être utile de considérer les points comme des « curseurs » (ou « carets ») d’une sélection 🤖 les points référencent toujours des nœuds de texte ! parce que ce sont les seuls à contenir des chaînes pouvant avoir des curseurs portée les ranges permettent de faire référence non seulement à un point unique dans le document, mais aussi à une étendue plus large de contenu entre deux points (un exemple de range est lorsque vous faites une sélection ) leur interface est interface range { anchor point focus point } 🤖 les termes « anchor » et « focus » sont empruntés au dom, voir anchor https //developer mozilla org/en us/docs/web/api/selection/anchornode et focus https //developer mozilla org/en us/docs/web/api/selection/focusnode un anchor et un focus sont établis par une interaction utilisateur le point anchor n’est pas toujours avant le point focus dans le document comme dans le dom, l’ordre entre un anchor et un focus dépend du fait que le range est fait en arrière ou en avant voici comment mozilla developer network l’explique un utilisateur peut faire une sélection de gauche à droite (dans l’ordre du document) ou de droite à gauche (à l’inverse de l’ordre du document) l’anchor est l’endroit où l’utilisateur commence la sélection et le focus est l’endroit où il la termine si vous faites une sélection avec une souris de bureau, l’anchor est placé là où vous appuyez sur le bouton de la souris et le focus est placé là où vous relâchez le bouton anchor et focus ne doivent pas être confondus avec les positions de début et de fin d’une sélection, puisque l’anchor peut être placé avant le focus ou l’inverse, selon la direction dans laquelle vous faites votre sélection — sélection, mdn https //developer mozilla org/en us/docs/web/api/selection une distinction importante est que les points anchor et focus des ranges référencent toujours les nœuds de texte au niveau feuille dans un document et ne référencent jamais des éléments ce comportement est différent du dom, mais il simplifie le travail avec les ranges puisqu’il y a moins de cas limites à gérer 🤖 pour plus d’informations, consultez la référence de l’api range docid\ hw3yngfmoa1zrqmkgrnrp selection les ranges sont utilisés à de nombreux endroits dans l’api de slate lorsque vous devez faire référence à une étendue de contenu entre deux points l’un des plus courants est la « sélection » actuelle de l’utilisateur la sélection est un range spécial qui est une propriété de l’ éditeur par exemple, supposons que quelqu’un ait actuellement sélectionné toute la phrase const editor = { selection { anchor { path \[0, 0], offset 0 }, focus { path \[0, 0], offset 15 }, }, children \[ { type 'paragraph', children \[ { text 'a line of text!', }, ], }, ], } 🤖 le concept de sélection est également emprunté au dom, voir sélection, mdn https //developer mozilla org/en us/docs/web/api/selection , bien que sous une forme grandement simplifiée, car slate ne permet pas plusieurs plages dans une seule sélection, ce qui rend les choses beaucoup plus simples à gérer il n’existe pas d’interface sélection c’est simplement un objet qui respecte l’interface plus générique portée à la place