Редактор TinyMCE с React Не видит загруженное изображение - PullRequest
Новая
       10

Редактор TinyMCE с React Не видит загруженное изображение

0 голосов
/ 19 ноября 2018

Я использую плагин редактора tinyMCE с реакцией js.Я могу загружать файлы с моего локального компьютера в редактор, но когда я нажимаю на кнопку редактирования, чтобы снова открыть редактор, я больше не вижу свое загруженное изображение.Другими словами, я не могу получить доступ к своему изображению при повторном открытии редактора после загрузки изображения.Есть предложения? 

<div className="form-group">
      <input id="my-file" type="file" name="my-file" style={{display:"none"}} onChange="" />
        <TinyMCE
          content={editorContent}
          onChange={handleEditorState}
          config={{
                //   selector: '.post-article #' + editorId,
              height: 400,
              plugins: [
                  'advlist autolink lists link image charmap print preview anchor',
                  'searchreplace wordcount visualblocks code fullscreen',
                  'insertdatetime media table contextmenu paste code'
              ],
              toolbar: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',
              content_css: '//www.tinymce.com/css/codepen.min.css',
              file_browser_callback_types: 'image',
              file_picker_callback: function (callback, value, meta) {
                if (meta.filetype == 'image') {
                    var input = document.getElementById('my-file');
                    input.click();
                    input.onchange = function () {
                        var file = input.files[0];
                        var reader = new FileReader();
                        reader.onload = function (e) {
                            console.log('name',e.target.result);
                            callback(e.target.result, {
                                alt: file.name
                            });
                        };
                        reader.readAsDataURL(file);
                    };
                }
            },
              paste_data_images: true,

              }}
        />
      </div>
...