带有React钩子的千个分隔符输入

import React, { useState, useEffect } from 'react';

const ThousandSeparatorInput = () => {
  const [value, setValue] = useState('');

  useEffect(() => {
    // 使用正则表达式将输入值添加千位分隔符
    const formattedValue = value.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
    setValue(formattedValue);
  }, [value]);

  const handleChange = (event) => {
    // 移除输入值中的千位分隔符
    const inputValue = event.target.value.replace(/,/g, '');
    setValue(inputValue);
  };

  return (
    <input type="text" value={value} onChange={handleChange} />
  );
};

export default ThousandSeparatorInput;