NumericFormatの話

[AoSankaku]

const [borrowAmount, setBorrowAmount] = useState(0);
  const BorrowInput = () => {
    return (
      <>
        <NumericFormat
          required
          value={borrowAmount}
          customInput={TextField}
          id="outlined-start-adornment55555555555555555555"
          sx={{ width: 'auto', m: 1, minWidth: 120 }}
          label="金額2"
          thousandSeparator=","
          decimalScale={0}
          prefix={'¥ '}
          inputProps={{
            inputMode: 'numeric'
          }}
          onValueChange={(v) => {
            setBorrowAmount(v.floatValue);
          }}
        />
        <Typography variant="h6" gutterBottom style={{ marginTop: "30px" }}>
          {borrowAmount}
        </Typography>
      </>
    )
  }
//...

は再描画問題を起こすが、

//親レベル
  const BorrowInput = () => {
    const [borrowAmount, setBorrowAmount] = useState(0);
    return (
      <>
        <NumericFormat
          required
          value={borrowAmount}
          customInput={TextField}
          id="outlined-start-adornment55555555555555555555"
          sx={{ width: 'auto', m: 1, minWidth: 120 }}
          label="金額2"
          thousandSeparator=","
          decimalScale={0}
          prefix={'¥ '}
          inputProps={{
            inputMode: 'numeric'
          }}
          onValueChange={(v) => {
            setBorrowAmount(v.floatValue);
          }}
        />
        <Typography variant="h6" gutterBottom style={{ marginTop: "30px" }}>
          {borrowAmount}
        </Typography>
      </>
    )
  }
//...

は再描画問題を起こさないという話