Javascript 如何在草稿js中为图像添加标题？

是否可以在草稿js中呈现输入（用于向图像添加标题），并可以获取用户键入的数据？我熟悉“自定义块渲染”的概念，并遵循由提供的说明，但是，当我想在输入中写入某些内容时，我遇到了以下错误：

invariant.js:40未捕获的不变冲突：未知的DraftEntity键：null

事实上，block？.getEntityAt（0）返回null，因为我开始键入时字符列表会发生变化

这是自定义块渲染器代码：

从“React”导入React；
从“不可变”导入{fromJS}；
导出常量CustomBlockRenderer=（块、编辑器状态、道具）=>{
if（block.getType（）=“原子”）{
返回{
构成部分：媒体，
可编辑：false，
};
}
返回null；
};
常量图像=（道具）=>{
如果（！！props.src）{
返回；
}
返回null；
};
常量媒体=（道具）=>{
const entity=props.contentState？.getEntity（props？.block？.getEntityAt（0））；
const{src}=entity？.getData（）；
常量类型=实体？.getType（）；
让海关封锁；
如果（类型==“图像”）{
自定义块=(
{src？.caption}
);
}否则{
返回null；
}
返回自定义块；
};我最近遇到了一个类似的问题。它如何工作的简化演示。请注意，
draft js
中的
EditorBlock
组件用于图像标题节点。如果希望在自定义组件中有一个可编辑区域，则应在自定义组件中使用
EditorBlock

class MyCustomBlock extends React.Component {
  render() {
    const imgSrc = this.props.block.get("data").src;

    return (
      <div className="my-custom-block">
        <figure className="custom-block__image-wrap">
          <img src={imgSrc} className="custom-block__image" />
          <figcaption className="custom-block__caption">
            <EditorBlock {...this.props} />
          </figcaption>
        </figure>
      </div>
    );
  }
}

MyCustomBlock类扩展了React.Component{
render（）{
const imgSrc=this.props.block.get（“data”）.src；
返回(
);
}
}