Я не могу заставить работать функцию .find () в редакторе TipTap.
Возможно, я делаю это неправильно, но я использую следующий пример кода: https://github.com/scrumpy/tiptap/blob/master/examples/Components/Routes/SearchAndReplace/index.vue
Пример кода:
<editor-menu-bar :editor="editor" v-slot="{ commands }">
<el-button-group>
<el-button
class="menubar__button"
@click="commands.find(searchTerm)">
<i class="el-icon-picture-outline" />
</el-button>
</el-button-group>
</editor-menu-bar>
...
import { Editor, EditorContent, EditorMenuBar } from 'tiptap';
import {
Heading,
OrderedList,
BulletList,
ListItem,
Bold,
Italic,
Underline,
History,
Placeholder,
Search,
} from 'tiptap-extensions';
export default {
name: 'TextEditor',
components: {
EditorContent,
EditorMenuBar,
},
data() {
return {
editor: null,
html: '',
searchTerm: 'twee',
};
},
mounted() {
this.editor = new Editor({
extensions: [
new Heading({ levels: [1, 2, 3] }),
new BulletList(),
new OrderedList(),
new ListItem(),
new Bold(),
new Italic(),
new Underline(),
new History(),
new Placeholder({
emptyNodeClass: 'is-empty',
emptyNodeText: this.$t('descriptionPlaceholder'),
}),
new Search({
disableRegex: false,
}),
],
content: this.description,
onUpdate: ({ getHTML }) => {
this.html = getHTML();
this.$emit('input', this.html);
},
});
}
}
Редактор имеет следующий текст:
Een twee dr ie vier
twee
Так что у него действительно есть поисковый запрос, но он не выбирает его. Кроме того, когда я пытаюсь сделать это функционально, как console.log(this.editor.commands.find('twee'));
, он возвращает undefined
.
Кто-нибудь, кто может мне помочь с этим?
"tiptap": "^1.26.4"
"tiptap-extensions": "^1.28.4"
"vue": "^2.5.2"