Как реализовать редактор форматированного текста, такой как Quill или Draft.js, с помощью Next.js? - PullRequest
Новая
       32

Как реализовать редактор форматированного текста, такой как Quill или Draft.js, с помощью Next.js?

1 голос
/ 25 марта 2019

У меня есть большое приложение, которое я создаю с помощью Next.js для SEO и повышения производительности, и есть суперинтерактивная часть этого приложения, которая нуждается в текстовом редакторе (таком как Quill.js или Draft.js), где данныесинхронизируется между двумя пользователями с помощью Socket.io.

Проблема в том, что я не могу заставить текстовый редактор работать с Next.js.

Когда я импортирую Quill, он говорит:Документ не определен, потому что на сервере нет документа.С Draft.js он просто ничего не рендерит, но ошибок нет.

Вот мой код для Draft.js: 

import { EditorState, convertToRaw, convertFromRaw } from 'draft-js'


class TextEditor extends Component {
  constructor(props) {
    super(props);
    this.state = {
      editorState: EditorState.createWithContent(convertFromRaw(props.contentState))
    }
  }
  static async getInitialProps ({ query, req }) {
    return { contentState: convertToRaw(EditorState.createEmpty().getCurrentContent()) }
  }
  render() {
    console.log('init',this.props.editorState);
    return (
      <div>
        <h1>Test Editor</h1>
        <Editor
          editorState={ this.props.editorState }
        />
      </div>
    );
  }
}

Любая помощь?

1 Ответ

3 голосов
/ 25 марта 2019

Я думаю, что этот пример nextjs-with-draftjs может помочь в интеграции Draft.js в приложение Next.js.

...