当用作组件时，React.js失去了对输入的关注

Question

我试图更改输入onChange时，输入失去了对每个字母的关注

不工作：用作组件时

{Object.keys(dataProperties).length > 0 && Object.keys(dataProperties).map((item, index) => (
        <div key={index}>
          <PropertyController item={item} properties={dataProperties} modeType="Edit" changeEvent={changeValue} />
        </div>
))}

工作代码：不使用组件

{Object.keys(dataProperties).length > 0 && Object.keys(dataProperties).map((item, index) => (
        <div className="row" key={index}>
          <div className="col-4">
            <b>{item}</b>
          </div>
          <div className="col-1">
            <b>:</b>
          </div>
          <div className="col-7">
            <div className="form-group">
                <input type="text" className="form-control" value={dataProperties[item]} onChange={(e) => changeValue(e,item)} />
            </div>
          </div>
        </div>
))}

在 PropertyController 组件中，动态发送输入

const propertyContoller = props => {
let data = {
  index : props.index,
  item : props.item,
  properties : props.properties,
  key : props.key
}
let isView = props.modeType === "View" ? true : false;
let listOfPropertys = {
  Textarea : ["Name"],
  Dropdown : ["Service"],
  Checkbox : [],
  Radio : [],
  JsonEditor: ["Validation"]
}
function checkPropertyRender(){
  let PropertyType = "Text";
  let keys = Object.keys(listOfPropertys);
  for(var i=0;i<keys.length;i++){
    if(listOfPropertys[keys[i]].includes(props.item)){
      PropertyType = keys[i];
      break;
   }
}
return PropertyType;
}

const NewComponent = React.lazy(() =>
  import(`./PropertyFields/${checkPropertyRender()}`)
);

return (
  <Suspense fallback={<div> </div>}>
    <NewComponent data={data} changeEvent={props.changeEvent} isView= {isView}/>
  </Suspense>
  );
};

此 NewComponent 将呈现：

const Text = props => {
  return (
    <React.Fragment>
      <Form.Group as={Row} controlId={props.data.index} key= . 
  {props.data.index}>
    <Form.Label column sm="4">
        <b>{props.data.item}</b>
      </Form.Label>
      <Form.Label column sm="1">
        <b>:</b>
      </Form.Label>
      <Col sm="7">
        <Form.Control type="text" disabled={props.isView} value={props.data.properties[props.data.item]} onChange={(e) => props.changeEvent(e,props.data.item)}/>
      </Col>
  </Form.Group>
</React.Fragment>
 );
};

export default Text;

为此，我竭尽所能帮助任何人，没有任何帮助。