Я хочу запустить редактор draft-js с содержимым по умолчанию.Я использую drafts-js-import-html
для преобразования в неизменяемый контент редактора.Он отлично работает для простой строки html, но когда моя строка html содержит встроенные стили или атрибуты данных, она удаляется из сгенерированного вывода html
Пример
import Editor from 'draft-js-plugins-editor';
import {stateFromHTML} from 'draft-js-import-html';
class MyEditor extends Component {
constructor(props) {
super(props);
const html = `<p>hello <span data-mention-id="5c08eb31f66dc3141cceb27c" class="mentions" style="color: #22C8E3; cursor: pointer; text-decoration: underline">John Doe</span></p>`
const options = {
customInlineFn: (element, {Style}) => {
if (element.style.color) {
return Style('color-' + element.style.color); // this one
}
},
elementStyles: {
'mentions': {
'text-decoration': 'underline',
color: '#22C8E3',
cursor: 'pointer',
}
}
};
this.state = {
editorState: EditorState.createWithContent(stateFromHTML(html, options)),
};
}
onChange = (editorState) => {
this.setState({editorState});
}
render() {
return (
<Editor
editorState={this.state.editorState}
onChange={this.onChange}
/>
)
}
}
Как упоминалось в одном из вопросовhttps://github.com/sstur/draft-js-utils/issues/120 Я передаю параметры для добавления стилей, но не знаю, как сохранить атрибуты данных.Но ни одна из опций, которые я отправил, не устранила проблему.
Выходной html по-прежнему равен <span data-text="true" class="">hello John Doe </span>