how to make my textfield empty after button click

Question

This is my function

 const clicker = (input) => {
            setoutput((prev) => {
                return [...prev, input];
            });
        };

I passed above function as a prop

<Createcard click={clicker} />

this is my component where im using that function

const Createcard = (props) => {
  const [input, setInput] = useState({
    titel: "",
    content: "",
  });
  const setInputs = (event) => {
    const { name, value } = event.target;
    setInput((prevData) => {
      return {
        ...prevData,
        [name]: value,
      };
    });
  };
  // here I am passing my state value in function

  const clik = () => {
    props.click(input);
  };
  return (
    <div>
      <Card className={classes.root}>
        <TextField
          id="standard-basic"
          name="titel"
          value={input.titel}
          label="Titel"
          onChange={setInputs}
          placeholder="set"
          type="text"
        />
        <TextField
          id="standard-basic1"
          name="content"
          value={input.content}
          label="Content"
          onChange={setInputs}
        />
        // here i want to make my textfield empty after button click
        <Button className={classes.wid} onClick={clik}>
          <AddCircleOutlineIcon />
        </Button>
      </Card>
    </div>
  );
};

Answer 1

You can try to do something like this

const clik = () => {
  props.click(input);
  setInput({ titel: "", content: "" });
};

Answer 2

Just set the state properties to their initial value on your clik method

 setInput({ titel: "", content: "" });