Моя цель состоит в том, чтобы создать экземпляр декора строки редактора Monaco, который не расширяется до нижних строк, когда я нажимаю клавишу ввода в конце созданного декора.
Например, когда я создаю редактор Monaco (в React) и создаю экземпляр оформления линии с помощью следующего кода: `js
import { createStyles } from "@mantine/styles";
import Editor from "@monaco-editor/react";
import monaco from "monaco-editor/esm/vs/editor/editor.api";
import { useRef, useState } from "react";
const DecoratedEditor = () => {
const { classes } = useStyles();
const [code, setCode] = useState(`#include <iostream>
using namespace std;
//press enter on my end to see decoration expand
int main() {
cout << "Hello World!";
return 0;
}`);
const editorRef = useRef<monaco.editor.IStandaloneCodeEditor | null>(null);
return (
<Editor
value = {code}
language = "cpp"
theme = "vs-dark"
onChange = {(newValue) => {
if (!newValue) return;
setCode(newValue);
}}
beforeMount = {(monaco) => {}}
onMount = {(editor, monaco) => {
editorRef.current = editor;
editor.getModel()?.deltaDecorations(
[],
[
{
range: new monaco.Range(4, 1, 4, 47),
options: {
inlineClassName: classes.lineDecoration,
},
},
]
);
}}
height = {400}
/>
);
};
export default DecoratedEditor;
const useStyles = createStyles((theme) => {
return {
lineDecoration: {
width: "10px !important ",
backgroundColor: "rgb(255, 0, 0, 0.4)",
},
};
});
Я получаю следующий вывод: Обычный редактор с обычным оформлением
Но, если я нажму "Enter" в конце украшения в строке 4 и напишу в следующей строке, то я получаю это: Новое украшение
Есть ли способ предотвратить расширение украшения? Спасибо.
Я уже искал варианты в документации редактора Monaco, чтобы этого не произошло, но я не нашел ничего, что могло бы удовлетворить мои потребности.



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Я был там.
Это также поможет вам выполнить работу.
То есть
stickiness: 1
В вашем случае вы можете добавить еще один вариант в список.
options: {
inlineClassName: classes.lineDecoration,
stickiness: 1
}
липкость 1 это AlwaysGrowsWhenTypingAtEdges
/**
* Describes the behavior of decorations when typing/editing near their edges.
* Note: Please do not edit the values, as they very carefully match `DecorationRangeBehavior`
*/
export enum TrackedRangeStickiness {
AlwaysGrowsWhenTypingAtEdges = 0,
NeverGrowsWhenTypingAtEdges = 1,
GrowsOnlyWhenTypingBefore = 2,
GrowsOnlyWhenTypingAfter = 3
}
На всякий случай фрагмент кода выглядит так (вы можете использовать его по своему усмотрению):
decorations = editor.deltaDecorations([],
[
{
range: new monaco.Range(1, 1, 4, 4),
options: {
stickiness: 1, // NeverGrowsWhenTypingAtEdges
}
}
])
}