Как использовать Tiptap для реализации редактируемой встроенной метки? ⇐ Javascript

[Anonymous]

Я хочу использовать Tiptap для создания редактируемой встроенной метки,
но обнаружил, что курсор не может сфокусироваться на внутренней части метки.
Он всегда автоматически переходит к концу метки. p>
введите здесь описание изображения

const EditableTag = Node.create({
name: 'editableTag',
group: 'inline',
inline: true,
content: '(inline | text)*',

// ...

renderHTML({ HTMLAttributes }) {
return ['span', { 'data-type': 'editable-tag', class: 'editable-tag' }, 0]
},

addKeyboardShortcuts() {
return {
Enter: () => true,
Backspace: ({editor}) => {
const { selection } = editor.state
console.log('Backspace', editor.state);
return true;
}
}
},

addNodeView() {
return ({ node, getPos, editor }) => {
const wrapper = document.createElement('span')
wrapper.setAttribute('data-type', 'editable-tag')

// create contentDOM
const contentDOM = document.createElement('span')
contentDOM.textContent = node.attrs.value
contentDOM.classList.add('editable-tag-content')

wrapper.appendChild(contentDOM)

return {
dom: wrapper,
contentDOM, // set contentDOM as editable area
}
}
},

addCommands() {
// ...
}
});



Подробнее здесь: https://stackoverflow.com/questions/793 ... line-label