Я создаю текстовый редактор, используя Draft- js и React. Черновик - js позволяет стилизовать блок контента. Итак, у меня есть стилизованные кнопки заголовков (H1, H2, H3, H4) для отображения текста в указанном формате c (с указанием c размера шрифта и стиля). Моя проблема: я хочу создать иерархию в заголовке 1-го уровня и заголовке 2-го уровня (как вы можете видеть это на рисунке).
результат, который я хочу получить
Я уже решил проблему размера шрифта и стиля, создав констант customStyleMap.
const styleMap = {
HEADER1: {
fontFamily: '"Times New Roman"',
fontSize: 12,
fontWeight: 'bold',
},
HEADER2: {
fontFamily: '"Times New Roman"',
fontSize: 10,
fontWeight: 'bold'
},
HEADER3: {
fontFamily: '"Times New Roman"',
fontSize: 10,
fontWeight: 'bold'
},
HEADER4: {
fontFamily: '"Times New Roman"',
fontSize: 10,
fontWeight: 'Italic'
}
};
<Editor
blockStyleFn={getBlockStyle}
customStyleMap={styleMap}
editorState={editorState}
handleKeyCommand={this.handleKeyCommand}
onChange={this.onChange}
onTab={this.onTab}
ref="editor"
spellCheck={true}
/>
Я хочу знать, как я могу создать иерархию между всеми заголовками в заголовке первого уровня и тем же самым в заголовке второго уровня.