pref: optimize code block backspace shortcut key logic (#5936)

#### What type of PR is this?

/kind improvement
/area editor
/milestone 2.16.x

#### What this PR does / why we need it:

优化默认编辑器代码块 `Backspace` 快捷键逻辑。如下所示:

1. 选中内容时进行删除,保证光标仍处于代码块内。
2. 光标处于代码块首位或者代码块没有内容时,不再删除代码块。

#### How to test it?

测试默认编辑器代码块功能。查看是否符合上述逻辑

#### Which issue(s) this PR fixes:

Fixes #5927 

#### Does this PR introduce a user-facing change?
```release-note
优化默认编辑器代码块 Backspace 快捷键逻辑
```
pull/5965/head
Takagi 2024-05-21 17:46:45 +08:00 committed by GitHub
parent d29a377bbd
commit b762a9dac7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 27 additions and 0 deletions

View File

@ -5,6 +5,7 @@ import {
isActive, isActive,
findParentNode, findParentNode,
VueNodeViewRenderer, VueNodeViewRenderer,
isNodeActive,
} from "@/tiptap/vue-3"; } from "@/tiptap/vue-3";
import { import {
EditorState, EditorState,
@ -130,6 +131,32 @@ export default CodeBlockLowlight.extend<
}, },
addKeyboardShortcuts() { addKeyboardShortcuts() {
return { return {
Backspace: ({ editor }) => {
if (!isNodeActive(editor.state, this.name)) {
return false;
}
const { selection } = editor.state;
// Clear the selected content and adapt to the all-select shortcut key operation.
if (!selection.empty) {
editor
.chain()
.focus()
.deleteSelection()
.setTextSelection(selection.$from.pos)
.run();
return true;
}
const { $anchor } = selection;
const isAtStart = $anchor.parentOffset === 0;
// If the cursor is at the beginning of the code block or the code block is empty, it is not deleted.
if (isAtStart || !$anchor.parent.textContent.length) {
return true;
}
return false;
},
Tab: () => { Tab: () => {
if (this.editor.isActive("codeBlock")) { if (this.editor.isActive("codeBlock")) {
return this.editor.chain().focus().codeIndent().run(); return this.editor.chain().focus().codeIndent().run();