Как работает функция TipTap .find ()? - PullRequest
0 голосов
/ 14 марта 2020

Я не могу заставить работать функцию .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"
...