提问者:小点点

尝试访问表单数据时发生合成事件错误


我的react组件中有以下代码

import React, { useState } from "react";

function CreateArea() {
  var [items,setitems]=useState({title:{},content:""});

  function updatef(event){
    console.log(event);
  }
  return (
    <div>
      <form>
        <input name="title" onChange={updatef} placeholder="Title" />
        <textarea name="content" onChange={updatef} placeholder="Take a note..." rows="3" />
        <button>Add</button>
      </form>
    </div>
  );
}

export default CreateArea;

如您所见,如果用户正在输入框和文本区中键入,我试图触发updatef函数,但我得到以下警告

警告:由于性能原因,此合成事件被重用。 如果您看到了这种情况,那么您正在访问已释放/无效的合成事件上的属性target。 此设置为NULL。 如果必须保留原始合成事件,请使用event.persist()。

另外,我的Event.Target为null,我想访问输入和文本区域值并存储它们,但是Event.Target被设置为null

有人帮忙吗?


共1个答案

匿名用户

您可能需要声明一个箭头函数作为处理程序:

<input name="title" onChange={e => updatef(e)} placeholder="Title" />
<textarea name="content" onChange={e => updatef(e)} placeholder="Take a note..." rows="3" />