2016-08-19 23 views
9

Czy istnieje dokumentacja wyjaśniająca sposób zachowania akapitów podczas wklejania zawartości do pliku draft.js? Inne formowanie wygląda rozsądnie, ale wszystkie akapity bloków są zwinięte w jeden blok akapitu podczas wklejania.draft.js: jak zachować odstępy między akapitami podczas wklejania treści?

+0

spróbować https://github.com/sstur/draft-js-import- html, który ułatwia importowanie html. –

+0

Nie, draft-js-import-html nie jest w tym przypadku pomocą. (Używam już wersji roboczej-js-import-html do konwersji HTML na editorState w celu załadowania zawartości - działa dobrze). Ale to nie jest żadna pomoc, gdy _pastanie_ treści z innej aplikacji: _wszystkie separatory akapitu zostają usunięte. – SteveB

+0

wklejanie łańcucha html lub zwykłego tekstu? –

Odpowiedz

3

Niestety, nie ma publicznej dokumentacji przetwarzania wklejanych treści. Ale ponieważ projekt js jest open-source, czytanie źródeł przychodzi na ratunek.

Draft-js 0.9.1 i poniżej

Wystarczy określić p jak aliasem element unstyled blok używając blockRenderMap:

import { Map } from 'immutable'; 
import Editor from 'draft-js'; 

const customRenderMap = Map({ 
    unstyled: { 
    element: 'div', 
    // will be used in convertFromHTMLtoContentBlocks 
    aliasedElements: ['p'], 
    }, 
}); 

<Editor 
    editorState={this.state.editorState} 
    blockRenderMap={customRenderMap} 
/> 

Objaśnienie:

Po wklejeniu treści Funkcja draft-js, editOnPaste zostaje wywołana. Wewnątrz wersji roboczej stwierdza, że ​​wklejane treści to html (tak, gdy kopiujesz i wklejasz dowolny tekst z procesorów tekstowych, takich jak MS Word, Dokumenty Google lub Apple Pages, w rzeczywistości jest to html) i wywołuje convertFromHTMLToContentBlocks().

convertFromHTMLToContentBlocks() z kolei uses blockRenderMap w celu określenia sposobu dzielenia html na bloki.

Draft-js 0.10.0

div jest aliasem z pby default w [email protected]