@ParaBellum577

Draft.js copy paste styles?

Приветствую всех. Кто работал с draft.js? Нужна помощь...
Собественно код ниже добавляет редактор для текста, все работает нормально, но возникает такой вопрос:
У Editor есть options, в которых я описываю нужные мне тулзы, по факту мне нужно всего парочка. Но как быть с тем, что при копи-пасте текста из вне Editor подтягивает ненужные стили, включая цвет, отступы и т.д. Я знаю, что есть stripPastedStyles у редактора, который полностью отключает копирование стилей. Но мне нужно чтобы он распознавал ссылки, а остальные стили нет. Как быть?
jyWG6R2.png
import React, { useState, useEffect } from 'react';
import { Editor } from 'react-draft-wysiwyg';
import { EditorState, convertToRaw, convertFromRaw } from 'draft-js';
import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';

export default function TextEditor({ description, changeDescription }) {

  const rawDescription = convertFromRaw(JSON.parse(description));
  const [content, setContent] = useState(
    EditorState.createWithContent(rawDescription)
 );

  const toolbar = {
    options: ['inline', 'link', 'list', 'textAlign', 'history'],
    inline: { inDropdown: true },
    list: { inDropdown: true },
    textAlign: { inDropdown: true },
  };

  const handleChangeDescription = editorState => {
    const contentState = editorState.getCurrentContent();
    const json = JSON.stringify(convertToRaw(contentState));
    setContent(editorState);
    changeDescription(json);
  };

  return (
    <div className="text-form-editor">
      <Editor
        wrapperClassName="demo-wrapper"
        editorClassName="nts-input-desc editor-custom-styles"
        editorState={content}
        onEditorStateChange={handleChangeDescription}
        toolbar={toolbar}
      />
    </div>
  );
}
  • Вопрос задан
  • 397 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы