DraftJS - Как инициализировать редактор с пользовательским объектом? - PullRequest
Новая
       10

DraftJS - Как инициализировать редактор с пользовательским объектом?

0 голосов
/ 20 мая 2019

это больше вопрос стратегии, чем реального кода, но если вы чувствуете, что знаете, как решить мою задачу - поделитесь, пожалуйста, всем, что мне нужно, потому что я застрял.

Итак, я действительно перепутал все эти сущности, декораторы, convertFromRaw ... Кажется, везде есть catch-22, и я не знаю, с чего начать.

Итак, у меня есть текст, связанный с аудио с определенными словами, с временными кодами и функцией onClick, которые заставляют аудиопроигрыватель воспроизводить аудио с определенных позиций.

Мой исходный текст представляет собой массив: 

words = [{
    word: 'some word', 
    ... other attributes of certain word,
    }],

Моя цель - инициализировать редактор DraftJS таким образом, чтобы я не потерял эту информацию о взаимосвязи между словами и аудио.

Моя стратегия была:

  1. Создайте декоратор WordsToAudio, где я определяю компонент React, который будет использоваться для замены слов.
  2. Создание сущности, которая ведет себя как LINK, но на самом деле не является ссылкой, и каким-то образом передает реквизиты этой сущности (понятия не имею, как)
  3. Создать ContentState как-нибудь из моего массива слов.

Эта стратегия кажется разумной?

Где я могу передавать реквизиты объектам? Когда я делаю: 

    const contentStateWithEntity = contentState.createEntity(
      'UNCERTAIN',
      'MUTABLE',
      {playtime: timecode}
    );

Как передать временные коды определенным словам? Или как я могу начать сущность с реквизита?

И, наконец, как мне привязать пользовательскую функцию onClick к своим сущностям?

...