从onInput事件中获取值以在React中获得cotentEditable

Question

我有一个contentEditable标头，我想在其中获取onInput事件的值。到目前为止，我设法获得了event.target，但它返回了整个DOM节点。我只想获取标头的实际值。有用的想法受到高度赞赏。

到目前为止我尝试过的：

1. console.log(e.target.value)->返回undefined

2. console.log(e.target)->返回节点<h5 contenteditable="true" style="margin: 0px;">Lesson 1</h5>

3. 我还考虑过将节点转换为字符串并使用reg ex提取值，但是当console.log(e.target.toString())返回[object HTMLHeadingElement]

   ]时我不得不放弃

<h5 contentEditable style={{ margin: 0 }} onInput={e => {
          props.onChangeName(e.target.value)
          console.log(e.target)
      }}>
        {props.name}
</h5>

我有一个contentEditable标头，我想在其中获取onInput事件的值。到目前为止，我已经设法获取event.target，但是它返回了整个DOM节点。我只想获取...的实际值...

Answer 1

使用.value仅适用于表单html组件，使用contentEditable允许您编辑标记的contentEditable，这意味着可以访问可以运行的actuel内容：