а также

дал простой онлайн-редактор без идентификатора, реализованный в бэкэнде сNode.JS с Socket.IO, MongoDBи клиент используетреагировать подключение Socket.IO.

Для создания редактора я использовалFroala Editor с участиемреагируют-froala-WYSIWYG в качестве плагинов для React.

Я развернул свое приложение на Heroku наhttps://dontpad.herokuapp.com и он отлично работает с несколькими пользователями (Socket работает нормально).

Это мой скриншот о том, как он работал с 7 пользователями онлайн один раз и работает, когда кто-то меняет данные:


ошибка

Но я обнаружил, что после редактора Froala после изменения11 раз, сбой редактора Froalaи я не понимаю что происходит?

Это скриншот после изменения модели Froala10 рази он все еще работает:

И когда я изменил это в11грохнул:

Ошибка на консоли: (ошибка появляется только после5s так как редактор вылетает - LoL)

froala_editor.pkgd.min.js: 7 Uncaught TypeError: Невозможно прочитать свойство 'VOID_ELEMENTS' с нулевым значением в Object.f [as isEmpty] (froala_editor.pkgd.min.js: 7) в Object.E [as get] (froala_editor. pkgd.min.js: 9) at froala_editor.pkgd.min.js: 19


Исходный код

Это мой репо на githubhttps://github.com/huynhsamha/dontpad

Это мой код рендерингаFroala Editor

<FroalaEditor
            tag="textarea"
            model={this.props.model}
            config={configFrolaEditor}
            onModelChange={this._onChangeModel}
          />

я использовалRedux сопоставить состояние с реквизитами дочернему компоненту такmodel={this.props.model}.

const mapStateToProps = state => ({
  model: state.Model
});

А это_onChangeModel которые излучают в сокет и вызываютthis.props.editModel(model);, которыйmapDispatchToProps

  _onChangeModel = (model) => {
    this.timeShowTextSaving = Date.now();
    this.props.editModel(model);
    this.setState({ stateModel: msg.SAVING });
    socket.emit(conf.socket.client.modelChanged, {
      model, room: this.room
    });
  }


// This is mapDispatchToProps
const mapDispatchToProps = dispatch => ({
  editModel: (model) => {
    dispatch(actions.editModel(model));
  }
});

Этополная версия этого файла -Editor.jsx

А этомой конфиг компонента Froala Editor Что-то не так в моей конфигурации?

export const config = {
  placeholderText: 'Edit Your Content Here!',
  spellcheck: false,
  scaytAutoload: false,
  charCounterCount: false,
  theme: 'custom',
  indentMargin: 10,
  heightMin: window.screen.availHeight,
  fontFamily: {
    // fonts ...
  },
  toolbarButtons: [
    'bold', 'italic', // buttons ...
  ]
};

Кто-нибудь сталкивался с такой проблемой, как я?

Ответы на вопрос(1)

Ваш ответ на вопрос