Показать сообщение отдельно
  #2 (permalink)  
Старый 24.12.2019, 12:32
Аватар для komplekt_17
Аспирант
Отправить личное сообщение для komplekt_17 Посмотреть профиль Найти все сообщения от komplekt_17
 
Регистрация: 14.01.2017
Сообщений: 46

Вобщем, кому интересно, ответ нашёлся здесь
https://stackoverflow.com/questions/...for-react-hook
Пришлось реализовать на hooks
export const EditNotePopup = (props) => {

	const { editNote, idNote, textEditedNote } = props

  const [editorState, setEditorState] = 
  useState(EditorState.createEmpty())

  const getContentFromHTML = (stringHTML) => {
    const blocksFromHTML = convertFromHTML(stringHTML);
    const content = ContentState.createFromBlockArray(
      blocksFromHTML.contentBlocks
    );
    return content
  }

  useEffect (() => {
  	if(textEditedNote !==""){
					setEditorState(
		      	EditorState.createWithContent(
		      		getContentFromHTML(textEditedNote)
		    		)
		      );
		  }
	}, [textEditedNote]);

	// for export text note toHTML
	const toHTML = (raw) =>
	  raw ? convertToHTML(exporterConfig)(convertFromRaw(raw)) : ""

	return (
		<div
			id="modal-editNote"
			className="modal fade"
			tabIndex={-1}
			role="dialog"
			aria-labelledby="exampleModalCenterTitle"
			aria-hidden="true"
		>
			<div className="modal-dialog modal-dialog-centered" role="document">
				<div className="modal-content">
					<div className="modal-header">
						<h5 className="modal-title">EditNote</h5>
						<button
							type="button"
							className="close"
							data-dismiss="modal"
							aria-label="Close"
						>
							<span aria-hidden="true">&times;</span>
						</button>
					</div>
					<form
						id="formEditNote"
						onSubmit={ev => ev.preventDefault()}
						className="needs-validation"
						noValidate
					>
						<div className="modal-body">

							<div className="form-label-group">
								<label htmlFor="editTextNote">Text Note</label>
    <DraftailEditor
      editorState={editorState}
      onChange={setEditorState}
      
    />
							</div>

						</div>
						<div className="modal-footer"> 
							<button
								onClick={() => {
									$("#modal-editNote").modal("hide")
                  // приводим текст записи к html-string
                  const editedTextNote = 
                    toHTML(
                      serialiseEditorStateToRaw(
                      	editorState
                    	)
                    )
                  // отправляем editedNote в store
                  editNote(idNote, editedTextNote);
                  // очищаем поле редактора
                  setEditorState(EditorState.createEmpty());
								}}
								type="button"
								className="btn btn-success btn-block mt-3"
							>
								SAVE
							</button>
						</div>
					</form>
				</div>
			</div>
		</div>
	)
}

Тему можно закрывать
Ответить с цитированием