我怎样才能渲染侧面，只需点击一下，而不是使用 React Hook useState？

Question

如何在不使用 useState function 的情况下触发 onClick 事件并将常量传递给 function？ 目前，只要我在文本字段或选择框中更改某些内容，它就会再次呈现。 所以我只想保存这两个元素的值，只在我点击它们时将它们传递到一个 function

export default function ComboBox({ auswaehlen }) {
const [vorgesetzter, setVorgesetzter] = React.useState("");
const [org, setOrg] = React.useState("");

function handleChangeInput(e) {
 setVorgesetzter(e.target.innerText);
}

function handleChangeInputText(e) {
  setOrg(e.target.value);
}

return (
 <>
  <Row className="justify-content-center">
    <TextField
      id="standard-basic"
      label="ORG"
      value={org}
      onChange={handleChangeInputText}
    />
  </Row>
  <Row className="justify-content-center" style={{ marginTop: "30px" }}>
    <Autocomplete
      id="combo-box-demo"
      options={top100Films}
      onChange={handleChangeInput}
      getOptionLabel={(option) => option.title}
      style={{ width: 300 }}
      renderInput={(params) => (
        <TextField
          {...params}
          label="Vorgesetzter"
          variant="outlined"
          value={vorgesetzter}
        />
      )}
    />
  </Row>
  <Row className="justify-content-center" style={{ marginTop: "30px" }}>
    <Button
      variant="contained"
      color="primary"
      onClick={auswaehlen(org, vorgesetzter)}
    >
      übernehmen
    </Button>
  </Row>
</>
 );
}

Answer 1

我的猜测是你只需要改变这个：

onClick={auswaehlen(org, vorgesetzter)}

对此：

onClick={() => auswaehlen(org, vorgesetzter)}

单击时调用回调。

否则它会在编译器看到时立即调用，这是不好的。