Exit Break

Exit a large block using a shortcut.

Loading...
Files
components/demo.tsx
'use client';

import React from 'react';

import { Plate } from '@udecode/plate-common/react';

import { editorPlugins } from '@/components/editor/plugins/editor-plugins';
import { useCreateEditor } from '@/components/editor/use-create-editor';
import { Editor, EditorContainer } from '@/components/plate-ui/editor';

import { DEMO_VALUES } from './values/demo-values';

export default function Demo({ id }: { id: string }) {
  const editor = useCreateEditor({
    plugins: [...editorPlugins],
    value: DEMO_VALUES[id],
  });

  return (
    <Plate editor={editor}>
      <EditorContainer variant="demo">
        <Editor />
      </EditorContainer>
    </Plate>
  );
}

功能

  • 使用单个快捷键退出大文本块。

安装

npm install @udecode/plate-break

使用

import { ExitBreakPlugin } from '@udecode/plate-break/react';
 
const plugins = [
  // ...otherPlugins,
  ExitBreakPlugin.configure({
    options: {
      rules: [
        {
          hotkey: 'mod+enter',
        },
        {
          hotkey: 'mod+shift+enter',
          before: true,
        },
        {
          hotkey: 'enter',
          query: {
            start: true,
            end: true,
            allow: KEYS_HEADING,
          },
          relative: true,
          level: 1,
        },
      ],
    },
  }),
];

快捷键

KeyDescription
Cmd + Enter

在选中的块之后开始一个新块。

Cmd + Shift + Enter

在选中的块之前开始一个新块。

插件

ExitBreakPlugin

Options

Collapse all

    一个包含以下属性的规则对象数组：

API

exitBreak

使用快捷键退出大文本块。

Parameters

Collapse all

    编辑器实例。

    退出断开操作的选项。

Returns

Collapse all

    是否成功退出断开。

exitBreakAtEdges

检查选中的块是否在块的边缘，并在指定的情况下执行退出断开操作。

Parameters

Collapse all

    编辑器实例。

Returns

Collapse all

    是否查询了块的边缘。

    选中的块是否在块的边缘。

    选中的块是否在块的开始。

ExcalidrawFont