ââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââ â ð shadcn/directory/udecode/plate/api/core.cn â ââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââ
ââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââ
â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â
createPlateEditorçæäžäžªæ°ç PlateEditor å®äŸïŒäœ¿çšäžç»æä»¶åå
¶é
眮è¿è¡åå§åã
æå ³çŒèŸåšé çœ®çæŽå€è¯Šæ ïŒè¯·åé çŒèŸåšé 眮æåã
createPlatePlugin䜿çšç»å®é 眮å建äžäžªæ°ç Plate æä»¶ïŒæ¯ææ©å±ãåµå¥æä»¶æäœåè¿è¡æ¶é 眮ã
<API name="createPlatePlugin"> <APIParameters> <APIItem name="config" type="PlatePluginConfig | ((editor: PlateEditor) => PlatePluginConfig)"> æä»¶çé çœ®å¯¹è±¡ïŒæè¿åé 眮çåœæ°ãåŠææäŸåœæ°ïŒå°åšè§£ææä»¶æ¶äœ¿çšçŒèŸåšæ§è¡è¯¥åœæ°ãæå
³ `PlatePluginConfig` ç±»åç诊æ
ïŒè¯·åé
[PlatePlugin API](/docs/api/core/plate-plugin#plugin-properties)ã
</APIItem>
</APIParameters>
<APIReturns type="PlatePlugin">
äžäžªæ°çæä»¶å®äŸã
</APIReturns>
</API>
createTPlatePlugincreatePlatePlugin çæŸåŒç±»åçæ¬ã
æå
³ `TPlatePluginConfig` ç±»åç诊æ
ïŒè¯·åé
[PlatePlugin API](/docs/api/core/plate-plugin#plugin-properties)ã
</APIItem>
</APIParameters>
<APIReturns type="PlatePlugin<C>">
äžäžªæ°çæä»¶å®äŸã
</APIReturns>
</API>
toPlatePluginæ©å± SlatePlugin 以å建 React PlatePluginã
<API name="toPlatePlugin"> <APIParameters> <APIItem name="basePlugin" type="SlatePlugin"> èŠæ©å±çåºç¡ SlatePluginã </APIItem> <APIItem name="extendConfig" type="PlatePluginConfig | ((ctx: PlatePluginContext<C>) => PlatePluginConfig)" optional> æäŸæ©å±é 眮çåœæ°æå¯¹è±¡ãåŠææ¯åœæ°ïŒå®æ¥æ¶æä»¶äžäžæå¹¶åºè¿åéšå PlatePluginãåŠææ¯å¯¹è±¡ïŒå®åºæ¯éšå PlatePlugin é 眮ã </APIItem> </APIParameters> <APIReturns type="PlatePlugin"> äžäžªæ°çæä»¶å®äŸïŒç»åäºåºç¡ SlatePlugin åèœåæ©å±é 眮äžå®ä¹ç React ç¹å®ç¹æ§ã </APIReturns> </API>toTPlatePlugintoPlatePlugin çæŸåŒç±»åçæ¬ã
useEditorContainerRefuseEditorScrollRefuseScrollRefuseEditorPluginè·åçŒèŸåšåæä»¶äžäžæã
<API name="useEditorPlugin"> <APIParameters> <APIItem name="p" type="WithRequiredKey<P>"> å ·æå¿ éé®çæä»¶ææä»¶é 眮ã </APIItem> </APIParameters> <APIReturns type="PlatePluginContext"> <APIItem name="editor" type="PlateEditor"> åœåçŒèŸåšå®äŸã </APIItem> <APIItem name="plugin" type="PlatePlugin"> æä»¶å®äŸã </APIItem> <APIItem name="getOption" type="function"> è·åç¹å®é项åŒçåœæ°ã </APIItem> <APIItem name="getOptions" type="function"> è·åæä»¶ææé项çåœæ°ã </APIItem> <APIItem name="setOption" type="function"> 讟眮ç¹å®é项åŒçåœæ°ã </APIItem> <APIItem name="setOptions" type="function"> 讟眮å€äžªé项çåœæ°ã </APIItem> <APIItem name="store" type="PlateStore"> çŒèŸåšç Plate ååšã </APIItem> </APIReturns> </API>useEditorRefè·å Plate çŒèŸåšåŒçšèäžéæ°æž²æãè¿åççŒèŸåšå¯¹è±¡å¢åŒºäº store 屿§ïŒæäŸå¯¹ Plate ååšç访é®ã
useEditorSelector订é çŒèŸåšçç¹å®å±æ§ã
<API name="useEditorSelector"> <APIParameters> <APIItem name="selector" type="(editor: PlateEditor<V>, prev?: T) => T"> éæ©åšåœæ°ã </APIItem> <APIItem name="deps" type="DependencyList"> éæ©åšåœæ°çäŸèµé¡¹å衚ã </APIItem> <APIItem name="options" type="UseEditorSelectorOptions<T>" optional> éæ©åšåœæ°çé项ã </APIItem> </APIParameters> <APIOptions> <APIItem name="id" type="string" optional> plate çŒèŸåšç IDãä» åšåµå¥çŒèŸåšæ¶æçšãé»è®€äœ¿çšæè¿ççŒèŸåš idã </APIItem> <APIItem name="equalityFn" type="(a: T, b: T) => boolean" optional> ç¡®å®éæ©åšåœæ°ç»ææ¯åŠå·²æŽæ¹ççžçæ§åœæ°ãé»è®€äžº `(a, b) => a === b`ã </APIItem> </APIOptions> <APIReturns type="T"> éæ©åšåœæ°çè¿ååŒã </APIReturns> </API>useEditorStateè·ååžŠéæ°æž²æç Plate çŒèŸåšåŒçšã
<API name="useEditorState"> <APIParameters> <APIItem name="id" type="string" optional> plate çŒèŸåšç IDãé»è®€äœ¿çšæè¿ççŒèŸåš idã </APIItem> </APIParameters> <APIReturns type="PlateEditor"> çŒèŸåšåŒçšã </APIReturns> </API>useEditorComposingè·åçŒèŸåšç composing ç¶æã
useEditorReadOnlyè·åçŒèŸåšç readOnly ç¶æã
<API name="useEditorReadOnly">
<APIParameters>
<APIItem name="id" type="string" optional>
plate çŒèŸåšç IDã
</APIItem>
</APIParameters>
<APIReturns type="boolean">
çŒèŸåšæ¯åŠäžºåªè¯»ã
</APIReturns>
</API>
useEditorMountedè·åçŒèŸåšç isMounted ç¶æã
useEditorSelectionè·åçŒèŸåšçéåºã已记å¿åïŒåŠæèåŽçžååäžäŒéæ°æž²æã
<API name="useEditorSelection"> <APIParameters> <APIItem name="id" type="string" optional> plate çŒèŸåšç IDã </APIItem> </APIParameters> <APIReturns type="TRange | null"> çŒèŸåšäžçåœåéåºã </APIReturns> </API>useEditorVersionè·åçŒèŸåšåŒççæ¬ãæ¯æ¬¡çŒèŸåšæŽæ¹æ¶è¯¥çæ¬éœäŒéå¢ã
<API name="useEditorVersion"> <APIParameters> <APIItem name="id" type="string" optional> plate çŒèŸåšç IDã </APIItem> </APIParameters> <APIReturns type="number"> çŒèŸåšåŒçåœåçæ¬ã </APIReturns> </API>useSelectionVersionè·åçŒèŸåšéåºççæ¬ãæ¯æ¬¡éåºæŽæ¹(èåŽäžå)æ¶è¯¥çæ¬éœäŒéå¢ã
<API name="useSelectionVersion"> <APIParameters> <APIItem name="id" type="string" optional> plate çŒèŸåšç IDã </APIItem> </APIParameters> <APIReturns type="number"> çŒèŸåšéåºçåœåçæ¬ã </APIReturns> </API>useSelectionCollapseduseSelectionExpandeduseSelectionWithinBlockuseSelectionAcrossBlocksuseSelectionFragmentè¿ååœåéåºççæ®µïŒå¯éæ©è§£æç»æèç¹ã
<API name="useSelectionFragment"> <APIReturns type="TElement[]"> åœåéåºççæ®µãåŠæéåºæªå±åŒææªæŸå°ç段ïŒåè¿å空æ°ç»ã </APIReturns> </API>useSelectionFragmentPropè¿åä»åœåéåºç段掟çç屿§åŒã
<API name="useSelectionFragmentProp"> <APIOptions type="GetSelectionFragmentOptions & GetFragmentPropOptions" optional> <APIItem name="key" type="string" optional> èŠä»æ¯äžªèç¹æåç屿§é®ã </APIItem> <APIItem name="defaultValue" type="string" optional> åŠææªæŸå°ææå±æ§åè¿åçé»è®€åŒã </APIItem> <APIItem name="getProp" type="(node: TElement | TText) => any" optional> ä»èç¹æå屿§åŒçèªå®ä¹åœæ°ã </APIItem> <APIItem name="mode" type="'all' | 'block' | 'text'" optional> ç¡®å®åŠäœéåçæ®µ: - 'all': æ£æ¥åèç¹åææ¬èç¹ - 'block': ä» æ£æ¥åèç¹ - 'text': ä» æ£æ¥ææ¬èç¹'block'
</APIItem>
useNodePathè¿åçŒèŸåšäžèç¹çè·¯åŸã
<API name="useNodePath"> <APIParameters> <APIItem name="node" type="TNode"> èŠæ¥æŸè·¯åŸçèç¹ã </APIItem> </APIParameters> <APIReturns> 衚瀺èç¹åšçŒèŸåšæ ç»æäžäœçœ®çè®°å¿å Path æ°ç»ã </APIReturns> </API>usePathè·åæè¿å çŽ çè®°å¿åè·¯åŸã
<API name="usePath"> <APIParameters> <APIItem name="pluginKey" type="string" optional> èŠè·åè·¯åŸçæä»¶é®ã </APIItem> </APIParameters> <APIReturns> å çŽ çè·¯åŸïŒåŠæåšèç¹ç»ä»¶äžäžæä¹å€äœ¿çšåè¿å `undefined`ã </APIReturns> </API>usePluginOptionçšäºä»æä»¶ååšè®¿é®æä»¶é项ç Hookãçšäº <Plate> å
éšã
// 访é®ç®åé项
const value = usePluginOption(plugin, 'value');
// 䜿çšåæ°è®¿é®éæ©åš
const doubleValue = usePluginOption(plugin, 'doubleValue', 2);
// 䜿çšçžçåœæ°è®¿é®
const value = usePluginOption(plugin, 'value', (a, b) => a === b);
// è®¿é®æŽäžªç¶æ
const state = usePluginOption(plugin, 'state');
</API>
useEditorPluginOptionçšäºä»æä»¶ååšè®¿é®æä»¶é项ç Hookãçšäº <Plate> å€éšã
// 访é®ç®åé项
const value = useEditorPluginOption(editor, plugin, 'value');
// 䜿çšåæ°è®¿é®éæ©åš
const doubleValue = useEditorPluginOption(editor, plugin, 'doubleValue', 2);
// 䜿çšçžçåœæ°è®¿é®
const value = useEditorPluginOption(editor, plugin, 'value', (a, b) => a === b);
// è®¿é®æŽäžªç¶æ
const state = useEditorPluginOption(editor, plugin, 'state');
</API>
useElementéè¿æä»¶é®è·åå çŽ ã
<API name="useElement"> <APIParameters> <APIItem name="pluginKey" type="string" optional> èŠè·åå çŽ çæä»¶é®ã - **é»è®€åŒ:** `'element'` </APIItem> </APIParameters> <APIReturns> ç±»å䞺 `T extends TElement` çå çŽ ïŒåŠæåšèç¹ç»ä»¶äžäžæä¹å€äœ¿çšåè¿å空对象ã </APIReturns> </API>DebugPluginæäŸå ·æå¯é 眮æ¥å¿çº§å«åé误å€çåèœçè°è¯åèœã
æ¥çè°è¯äºè§£æŽå€è¯Šæ ã
SlateExtensionPlugin & SlateReactExtensionPluginæ©å±æ žå¿ API å¹¶æ¹è¿é»è®€åèœã
DOMPlugin & ReactPluginå° React ç¹å®åèœéæå°çŒèŸåšäžã
HistoryPlugin䞺çŒèŸåšå¯çšæ€éåéååèœã
InlineVoidPlugin管ççŒèŸåšäžçå èå空å çŽ ã
ParserPluginå€ççŒèŸåšå 容çè§£æã
LengthPluginåŒºå¶æ§è¡çŒèŸåšå 容çæå€§é¿åºŠéå¶ã
HtmlPluginå¯çš HTML åºåååååºååã
AstPluginå€ççŒèŸåšçæœè±¡è¯æ³æ (AST)æäœã
ParagraphPluginæäŸæ®µèœæ ŒåŒååèœã
EventEditorPlugin管ççŒèŸåšäºä»¶ïŒåŠçŠç¹å倱çŠã
isTypeæ£æ¥èç¹æ¯åŠå¹é æäŸçç±»åã
<API name="isType"> <APIParameters> <APIItem name="editor" type="PlateEditor<V>"> èç¹æåšççŒèŸåšã </APIItem> <APIItem name="node" type="any"> èŠæ£æ¥çèç¹ã </APIItem> <APIItem name="key" type="string | string[]" optional> èŠäžèç¹å¹é çç±»åæç±»åæ°ç»ãå¯ä»¥æ¯å笊䞲æå笊䞲æ°ç»ã </APIItem> </APIParameters> <APIReturns> 衚瀺èç¹çç±»åæ¯åŠå¹é æäŸçç±»åæç±»åçåžå°åŒã </APIReturns> </API><PlateElement>çšäºæž²æå çŽ çéçšç»ä»¶ã
<API name="PlateElement"> <APIProps> <APIItem name="className" type="string" optional> åºçšäºç»ä»¶ç CSS ç±»ã </APIItem> <APIItem name="editor" type="E"> çŒèŸåšå®äŸãä¹å¯äœ¿çš `useEditorRef` hook è·åã </APIItem> <APIItem name="element" type="TElement"> å çŽ èç¹ãä¹å¯äœ¿çš `useElement` hook è·åã </APIItem> <APIItem name="path" type="Path"> å çŽ åšçŒèŸåšæ äžçè·¯åŸãä¹å¯äœ¿çš `usePath` hook è·åã </APIItem> <APIItem name="attributes" type="HTMLAttributes<HTMLElement>"> èŠåºçšå°é¡¶å±å çŽ çå çŽ å±æ§ã <APISubList> <APISubListItem parent="attributes" name="data-slate-node" type="'element'"> å§ç»è®Ÿçœ®äžº `'element'`ã </APISubListItem> <APISubListItem parent="attributes" name="data-slate-inline" type="boolean" optional /> <APISubListItem parent="attributes" name="data-slate-void" type="boolean" optional /> <APISubListItem parent="attributes" name="dir" type="string" optional /> <APISubListItem parent="attributes" name="ref" type="any"> å çŽ çåŒçšãåŠæäœ¿çšèªå·±çåŒçšïŒè¯·äžæ€åŒçšåå¹¶ã </APISubListItem> </APISubList> </APIItem> <APIItem name="children" type="any"> æž²æèç¹åå çŽ æå¿ éã </APIItem> <APIItem name="as" type="React.ElementType" optional> èŠæž²æçç»ä»¶ç±»åã - **é»è®€åŒ:** `'div'` </APIItem> </APIProps> </API><PlateLeaf>çšäºæž²æå¶èç¹çéçšç»ä»¶ã
<API name="PlateLeaf"> <APIProps> <APIItem name="className" type="string" optional> åºçšäºç»ä»¶ç CSS ç±»ã </APIItem> <APIItem name="editor" type="E"> çŒèŸåšäžäžæã </APIItem> <APIItem name="children" type="any"> æž²æèç¹åå çŽ æå¿ éã </APIItem> <APIItem name="leaf" type="TText"> å¶èç¹ã </APIItem> <APIItem name="text" type="TText"> ææ¬èç¹ã </APIItem> <APIItem name="attributes" type="HTMLAttributes<HTMLElement>"> èŠåºçšå°é¡¶å±å çŽ çå¶èç¹å±æ§ã <APISubList> <APISubListItem parent="attributes" name="data-slate-leaf" type="true"> å§ç»è®Ÿçœ®äžº `true`ã </APISubListItem> </APISubList> </APIItem> <APIItem name="as" type="React.ElementType" optional> èŠæž²æçç»ä»¶ç±»åã - **é»è®€åŒ:** `'span'` </APIItem> </APIProps> </API><PlateText>çšäºæž²æææ¬çéçšç»ä»¶ã
<API name="PlateText"> <APIProps> <APIItem name="className" type="string" optional> åºçšäºç»ä»¶ç CSS ç±»ã </APIItem> <APIItem name="text" type="TText"> ææ¬èç¹ã </APIItem> <APIItem name="attributes" type="HTMLAttributes<HTMLElement>"> èŠåºçšå°é¡¶å±å çŽ çææ¬å±æ§ã </APIItem> <APIItem name="children" type="any"> æž²æèç¹åå çŽ æå¿ éã </APIItem> <APIItem name="as" type="React.ElementType" optional> èŠæž²æçç»ä»¶ç±»åã - **é»è®€åŒ:** `'span'` </APIItem> </APIProps> </API>â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â â
ââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââ