js 原子级操作_自定义原子块中的draft-js文本

使用Draft-js，我通过实体将一个原子块插入编辑器：

const contentState = editorState.getCurrentContent();

const contentStateWithEntity = contentState.createEntity(

'IMAGE',

'IMMUTABLE',

{src: 'https://some.image.png' }

);

const entityKey = contentStateWithEntity.getLastCreatedEntityKey();

const newEditorState = EditorState.set(

editorState,

{currentContent: contentStateWithEntity}

);

// causes re-render with editorState

this.onChange(

AtomicBlockUtils.insertAtomicBlock(

newEditorState,

entityKey,

' '

)

);

使用 blockRendererFn ，我使用实体数据渲染自定义组件以在div中渲染图像：

render() {

return (

);

}

我希望能够为图像(实体)添加 Headers . 我尝试将一个输入框连接到我的组件中的状态，这将合并实体数据，但是如果触发任何类型的输入框文本，它似乎只是删除实体 .

render() {

return (

);

}

有谁知道如何在自定义块中有自定义输入区域？